<!DOCTYPE html>
<!-- saved from url=(0037)http://www.huodongju.com/Studio/index -->
<html lang="zh-cmn-Hans">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <link rel="stylesheet" type="text/css" href="../../css/mgt/common/style1503546983737.css">
  <style type="text/css">.amap_lib_placeSearch {
    font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #565656;
    font-size: 12px;
    line-height: 22px;
    word-wrap: break-word;
    background-color: #fff;
    border: 1px solid silver;
    -webkit-text-size-adjust: none;
    text-size-adjust: none
  }

  .amap_lib_placeSearch .pageLink {
    cursor: pointer;
    line-height: 16px;
    display: inline-block;
    text-align: center;
    padding: 0 4px
  }

  .amap_lib_placeSearch.mobile .pageLink {
    border: 1px solid #ddd;
    background: #eee;
    padding: 2px 3px
  }

  .amap_lib_placeSearch .pageLink:hover {
    background: #ccc
  }

  .amap_lib_placeSearch .pageLink.current {
    background: #0091ff;
    color: #fff
  }

  .amap_lib_placeSearch_list {
    background: #fff
  }

  .amap_lib_placeSearch .poibox .poibox-icon {
    margin-left: 7px;
    margin-top: 4px
  }

  .amap_lib_placeSearch_page {
    white-space: nowrap;
    text-align: right;
    background: #e5ecf9;
    margin-top: 5px;
    padding: 2px;
    overflow: hidden
  }

  .amap_lib_placeSearch_page > div {
    float: left;
    margin-right: 5px
  }

  .amap_lib_placeSearch_page > div > p {
    margin: 0;
    padding: 0;
    white-space: nowrap
  }

  .amap_lib_placeSearch_ol {
    list-style: none;
    padding: 0;
    margin: 0
  }

  .amap_lib_placeSearch_li {
    margin: 2px 0;
    padding: 0 5px 5px 0;
    cursor: pointer;
    overflow: hidden;
    line-height: 17px
  }

  .amap_lib_placeSearch_li .amap_lib_placeSearch_li_wrap {
    overflow: hidden;
    padding: 0 5px
  }

  .amap_lib_placeSearch_li_wrap_selected {
    background-color: #f0f0f0
  }

  .amap_lib_placeSearch_li > div .amap_lib_placeSearch_li_title {
    line-height: 20px;
    font-size: 12px
  }

  .amap_lib_placeSearch_li > div .amap_lib_placeSearch_li_title span {
    color: #00c
  }

  .amap_lib_placeSearch_li > div .amap_lib_placeSearch_li_title a {
    margin-left: 5px;
    font-size: 12px;
    color: #3d6dcc;
    font-weight: 400;
    text-decoration: none
  }

  .amap_lib_placeSearch_li > div .amap_lib_placeSearch_li_text {
    padding: 2px 0;
    line-height: 18px;
    overflow: hidden
  }

  .amap_lib_placeSearch_li > div .amap_lib_placeSearch_li_text b {
    float: left;
    font-weight: 700;
    overflow: hidden;
    padding-right: 5px
  }

  .amap_lib_placeSearch_li > div .amap_lib_placeSearch_li_text span {
    color: #666;
    display: block;
    zoom: 1;
    overflow: hidden
  }

  .amap-lib-infowindow .amap-lib-infowindow-content-wrap {
    word-break: break-all;
    overflow: hidden;
    zoom: 1
  }

  .amap-lib-infowindow {
    padding: 0;
    position: relative;
    background-color: #fff;
    margin: 8px
  }

  .amap-lib-infowindow-title {
    line-height: 22px;
    font-size: 14px;
    border-bottom: 1px #99adce solid;
    padding-right: 15px
  }

  .amap-lib-infowindow-content {
    padding-top: 5px;
    overflow: hidden;
    font-size: 12px;
    zoom: 1
  }

  .selected .amap_lib_placeSearch_poi {
    background-image: url(http://webapi.amap.com/theme/v1.3/markers/n/mark_r.png)
  }

  .amap_lib_placeSearch_poi {
    background: url(http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png) no-repeat;
    height: 31px;
    width: 19px;
    cursor: pointer;
    left: -1px;
    text-align: center;
    color: #fff;
    font: 12px arial, simsun, sans-serif;
    padding-top: 3px
  }

  .selected .amap_lib_placeSearch_child_poi {
    background-image: url(http://webapi.amap.com/theme/v1.3/hotNewRed.png)
  }

  .amap_lib_placeSearch_child_poi {
    width: 11px;
    height: 11px;
    border: 1px solid #eee;
    border-radius: 6px;
    background: url(http://webapi.amap.com/theme/v1.3/hotNew.png) center center no-repeat;
    text-indent: -10000em;
    overflow: hidden
  }

  .poi-children-box {
    padding: 3px 0 3px 25px
  }

  .poi-child-item.selected {
    border-color: #e17070
  }

  .poi-child-item {
    display: inline-block;
    line-height: 180%;
    border: 1px solid #ccc;
    background: #f3f3f3;
    margin: 0 3px 3px 0;
    padding: 0 3px;
    width: 27%;
    min-width: 40px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    text-align: center
  }

  .poi-child-item:hover {
    background: #ddd
  }

  .amap_lib_placeSearch .amap_lib_placeSearch_poi {
    position: absolute
  }

  .amap_lib_placeSearch ol, .amap_lib_placeSearch ul {
    list-style: none;
    margin: 0;
    padding: 0
  }

  .amap_lib_placeSearch .poibox {
    border-bottom: 1px solid #eaeaea;
    cursor: pointer;
    padding: 5px 0 5px 10px;
    position: relative;
    min-height: 35px
  }

  .amap_lib_placeSearch .poibox:last-child {
    border-bottom: none
  }

  .amap_lib_placeSearch .poibox .poi-title {
    margin-left: 25px;
    font-size: 13px;
    overflow: hidden
  }

  .amap_lib_placeSearch .poi-more {
    color: #0091ff;
    font-size: 12px;
    line-height: 22px;
    white-space: nowrap;
    vertical-align: baseline
  }

  .amap-pl-pc .poi-more, .amap-pl-pc .poi-name {
    vertical-align: middle
  }

  .amap_lib_placeSearch .poibox .poi-info {
    word-break: break-all;
    margin: 0 0 0 25px;
    overflow: hidden
  }

  .amap_lib_placeSearch .poibox .poi-info p {
    color: #999;
    font-family: Tahoma;
    line-height: 20px
  }

  .amap_lib_placeSearch p {
    margin: 0
  }

  .amap_lib_placeSearch h1, h2, h3, h4, h5 {
    font-weight: 400;
    margin: 0
  }

  .amap_lib_placeSearch .poibox.active, .amap_lib_placeSearch .poibox.hover, .amap_lib_placeSearch .poibox:hover {
    background: #f6f6f6
  }

  .amap_lib_placeSearch .poibox .select-btn {
    margin-left: 25px;
    margin-top: 6px;
    border: 0;
    color: #fff;
    cursor: pointer;
    padding: 3px 6px;
    border-radius: 2px;
    background-color: #0091ff
  }

  .amap-combo-close {
    position: absolute;
    top: 11px;
    right: 10px;
    background: url(http://webapi.amap.com/theme/v1.3/images/amap-info.png) -1px -151px no-repeat;
    width: 12px;
    height: 12px;
    cursor: pointer
  }

  .amap-content-body {
    min-width: 200px;
    max-width: 240px;
    font-family: Helvetica, "Hiragino Sans GB", "Microsoft Yahei", "微软雅黑", Arial, sans-serif;
    box-shadow: 0 0 .5px rgba(0, 0, 100, .6);
    background: #fff;
    border-radius: 2px;
    text-align: left;
    border: 1px solid silver
  }

  .amap-combo-sharp {
    margin: 0 auto;
    bottom: 1px;
    position: relative;
    background: url(http://webapi.amap.com/theme/v1.3/images/amap-info.png) -5px -564px no-repeat;
    width: 18px;
    height: 9px
  }

  .amap-pl-pc .poi-img {
    float: right;
    margin: 3px 8px 0;
    width: 90px;
    height: 56px;
    overflow: hidden
  }

  .amap-pl-pc .poi-more {
    display: inline-block;
    width: 16px;
    height: 16px;
    text-indent: -1000em;
    background: url(http://webapi.amap.com/theme/v1.3/images/newpc/tips.png) center center no-repeat;
    cursor: pointer;
    opacity: .5;
    margin: 1px 0 1px 2px;
    background-size: 85%
  }

  .amap-pl-pc .poi-more:hover {
    opacity: 1;
    background-size: 100%
  }

  .amap_lib_placeSearch .clear {
    clear: both
  }

  .amap-pls-marker-tip {
    position: absolute;
    background: #fff;
    display: none;
    top: 0;
    left: -100px;
    min-width: 100px;
    width: auto;
    white-space: nowrap;
    line-height: 200%;
    padding: 0 0 0 7px;
    font-size: 13px;
    border-radius: 2px;
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .5);
    -moz-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .5);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .5);
    transition: all .5s 1s;
    z-index: 150
  }

  .amap-pls-marker-tip .title {
    display: inline-block;
    vertical-align: middle;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 35px
  }

  .amap_lib_placeSearch_child_con .amap-pls-marker-tip {
    top: -7px
  }

  .amap-marker .hover .amap_lib_placeSearch_child_con .amap-pls-marker-tip {
    left: 23px
  }

  .amap-marker .hover .amap-pls-marker-tip {
    display: block;
    left: 28px
  }

  .amap-marker .hover.selected .amap-pls-marker-tip {
    display: none
  }

  .amap-pls-marker-tip::after, .amap-pls-marker-tip::before {
    content: "";
    width: 0;
    height: 0;
    top: 50%;
    left: 0;
    margin-top: -7px;
    margin-left: -15px;
    position: absolute;
    border: 7px solid transparent;
    border-right: 8px solid rgba(51, 51, 51, .2)
  }

  .amap-pls-marker-tip::after {
    margin-left: -14px;
    border-right: 8px solid rgba(255, 255, 255, 1)
  }</style>
  <style type="text/css">.amap-indoor-map .label-canvas {
    position: absolute;
    top: 0;
    left: 0
  }

  .amap-indoor-map .highlight-image-con * {
    pointer-events: none
  }

  .amap-indoormap-floorbar-control {
    position: absolute;
    margin: auto 0;
    bottom: 165px;
    right: 12px;
    width: 35px;
    text-align: center;
    line-height: 1.3em;
    overflow: hidden;
    padding: 0 2px
  }

  .amap-indoormap-floorbar-control .panel-box {
    background-color: rgba(255, 255, 255, .9);
    border-radius: 3px;
    border: 1px solid #ccc
  }

  .amap-indoormap-floorbar-control .select-dock {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    box-sizing: border-box;
    height: 30px;
    border: solid #4196ff;
    border-width: 0 2px;
    border-radius: 2px;
    pointer-events: none;
    background: linear-gradient(to bottom, #f6f8f9 0, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%)
  }

  .amap-indoor-map .transition {
    transition: opacity .2s
  }

  ,
  .amap-indoormap-floorbar-control .transition {
    transition: top .2s, margin-top .2s
  }

  .amap-indoormap-floorbar-control .select-dock:after, .amap-indoormap-floorbar-control .select-dock:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    left: 0;
    top: 10px;
    border: solid transparent;
    border-width: 4px;
    border-left-color: #4196ff
  }

  .amap-indoormap-floorbar-control .select-dock:after {
    right: 0;
    left: auto;
    border-left-color: transparent;
    border-right-color: #4196ff
  }

  .amap-indoormap-floorbar-control.is-mobile {
    width: 37px
  }

  .amap-indoormap-floorbar-control.is-mobile .floor-btn {
    height: 35px;
    line-height: 35px
  }

  .amap-indoormap-floorbar-control.is-mobile .select-dock {
    height: 35px;
    top: 36px
  }

  .amap-indoormap-floorbar-control.is-mobile .select-dock:after, .amap-indoormap-floorbar-control.is-mobile .select-dock:before {
    top: 13px
  }

  .amap-indoormap-floorbar-control.is-mobile .floor-list-box {
    height: 105px
  }

  .amap-indoormap-floorbar-control .floor-list-item .floor-btn {
    color: #555;
    font-family: "Times New Roman", sans-serif, "Microsoft Yahei";
    font-size: 16px
  }

  .amap-indoormap-floorbar-control .floor-list-item.selected .floor-btn {
    color: #000
  }

  .amap-indoormap-floorbar-control .floor-btn {
    height: 28px;
    line-height: 28px;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
  }

  .amap-indoormap-floorbar-control .floor-btn:hover {
    background-color: rgba(221, 221, 221, .4)
  }

  .amap-indoormap-floorbar-control .floor-minus, .amap-indoormap-floorbar-control .floor-plus {
    position: relative;
    text-indent: -1000em
  }

  .amap-indoormap-floorbar-control .floor-minus:after, .amap-indoormap-floorbar-control .floor-plus:after {
    content: "";
    position: absolute;
    margin: auto;
    top: 9px;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    border: solid transparent;
    border-width: 10px 8px;
    border-top-color: #777
  }

  .amap-indoormap-floorbar-control .floor-minus.disabled, .amap-indoormap-floorbar-control .floor-plus.disabled {
    opacity: .3
  }

  .amap-indoormap-floorbar-control .floor-plus:after {
    border-bottom-color: #777;
    border-top-color: transparent;
    top: -3px
  }

  .amap-indoormap-floorbar-control .floor-list-box {
    max-height: 153px;
    position: relative;
    overflow-y: hidden
  }

  .amap-indoormap-floorbar-control .floor-list {
    margin: 0;
    padding: 0;
    list-style: none
  }

  .amap-indoormap-floorbar-control .floor-list-item {
    position: relative
  }

  .amap-indoormap-floorbar-control .floor-btn.disabled, .amap-indoormap-floorbar-control .floor-btn.disabled *, .amap-indoormap-floorbar-control.with-indrm-loader * {
    -webkit-pointer-events: none !important;
    pointer-events: none !important
  }

  .amap-indoormap-floorbar-control .with-indrm-loader .floor-nonas {
    opacity: .5
  }

  .amap-indoor-map-moverf-marker {
    color: #555;
    background-color: #FFFEEF;
    border: 1px solid #7E7E7E;
    padding: 3px 6px;
    font-size: 12px;
    white-space: nowrap;
    display: inline-block;
    position: absolute;
    top: 1em;
    left: 1.2em
  }

  .amap-indoormap-floorbar-control .amap-indrm-loader {
    -moz-animation: amap-indrm-loader 1.25s infinite linear;
    -webkit-animation: amap-indrm-loader 1.25s infinite linear;
    animation: amap-indrm-loader 1.25s infinite linear;
    border: 2px solid #91A3D8;
    border-right-color: transparent;
    box-sizing: border-box;
    display: inline-block;
    overflow: hidden;
    text-indent: -9999px;
    width: 13px;
    height: 13px;
    border-radius: 7px;
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
  }

  @-moz-keyframes amap-indrm-loader {
    0% {
      -moz-transform: rotate(0);
      transform: rotate(0)
    }
    100% {
      -moz-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }

  @-webkit-keyframes amap-indrm-loader {
    0% {
      -webkit-transform: rotate(0);
      transform: rotate(0)
    }
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }

  @keyframes amap-indrm-loader {
    0% {
      -moz-transform: rotate(0);
      -ms-transform: rotate(0);
      -webkit-transform: rotate(0);
      transform: rotate(0)
    }
    100% {
      -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg)
    }
  }</style>

  <title>活动聚 - 活动编辑</title>
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <link rel="stylesheet" href="../../css/mgt/common/component.css">
  <link rel="stylesheet" href="../../css/mgt/editActivity/edit.css">
  <link rel="stylesheet" href="../../css/mgt/common/public.css">
  <link rel="stylesheet" href="../../css/mgt/common/font-awesome.min.css">
  <link href="../../css/mgt/common/dragula.css" rel="stylesheet" type="text/css">
  <link rel="stylesheet" href="../../css/mgt/common/jquery.Jcrop.css">
  <link rel="stylesheet" href="../../css/mgt/common/jquery.datetimepicker.css">
  <link rel="stylesheet" href="../../css/mgt/common/animate.css">
  <link rel="stylesheet" href="../../css/mgt/common/main1119.css">
  <!--<link rel="stylesheet" type="text/css" href="/Public/plugin/colorPicker/spectrum.css">-->
  <!--<link rel="stylesheet" href="/Public/plugin/scrollStyle/jscrollpane20160121/style/jquery.jscrollpane.css" media="all">-->
  <!--<script src="https://cdn.bootcss.com/less.js/3.0.0-pre.4/less.min.js"></script>-->
  <script src="../../js/mgt/common/stats.js" name="MTAH5" sid="500494818" cid="500494820"></script>
  <script src="../../js/mgt/common/jquery2.1.2.js"></script>
  <script src="../../js/mgt/common/layer.js"></script>
  <link rel="stylesheet" href="../../css/mgt/common/layer.css" id="layuicss-skinlayercss">
  <script>

  </script>

  <!--[if IE 7]>
  <script src="https://cdn.bootcss.com/jquery/1.7/jquery.min.js"></script>
  <![endif]-->

  <!--[if IE 8]>
  <script src="https://cdn.bootcss.com/jquery/1.7/jquery.min.js">
  <![endif]-->
  <style>
    html, body {
      min-height: 100%;
    }

    body .layer-ie .layui-layer-btn .layui-layer-btn0 {
      background-color: #00a2d4 !important;
      padding: 0 50px !important;
    }

    .edui-default .edui-colorpicker-nocolor {
      height: auto !important;
    }

    .animated-fast {
      -webkit-animation-duration: 0.5s;
      -moz-animation-duration: 0.5s;
      -o-animation-duration: 0.5s;
      animation-duration: 0.5s;
    }

    .view_detail_container {
      /*overflow-x: hidden;*/
    }

    html, body {
      width: 100%;
      height: auto;
      font-size: 14px !important;
    }

    .layer-preview {
      background-color: rgba(0, 0, 0, 0.7);

    }

    .layer-preview .layui-layer-content {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    @media screen and (max-width: 1440px) {
      .lay-preview {
        width: 720px;
        height: 520px;
      }

      .lay-iframe {
        top: 58px !important;
        left: 18px !important;
      }

      .lay-preview-right {
        padding: 150px 180px 0 0;
      }
    }

    body .lay-video-hdj .layui-layer-title {
      text-align: center;
    }

    .option-sex {
      display: inline-block;
      /*background-color: #F5F5F5;*/
      border-radius: 4px;
      padding: 5px 18px;
      margin-right: 15px;
      border: 1px solid #DEDEDE;
    }

    .udraggable_contaier {
      position: fixed;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      /*border: 2px solid red;*/
    }

  </style>
  <style type="text/css">.amap-container {
    cursor: url(http://webapi.amap.com/theme/v1.3/openhand.cur), default;
  }

  .amap-drag {
    cursor: url(http://webapi.amap.com/theme/v1.3/closedhand.cur), default;
  }</style>
</head>
<body>
<!--头部导航-->
<header class="e-container" style="min-width: 1000px;">
  <div class="head-left">
    <input id="currentEditId" type="hidden" value="0">
    <input id="currentDraftId" type="hidden" value="0">
    <input id="currentDraftStatus" type="hidden" value="0">
    <input id="copy" type="hidden" value="0">
    <input id="templateId" type="hidden" value="0">
    <input id="toGuide" type="hidden" value="0">
    <input id="userId" type="hidden" value="5hs2fa">
    <div class="head-left-exit pointer">
      <span style="color: #f66926" class="fa fa-chevron-left f66926 fa-lg margin5px"></span>
      <span>退出编辑</span>
    </div>
    <div class="head-left-undo pointer not-allowed">
      <span class="fa fa-mail-reply dedede fa-lg"></span>
      <span class="font12 margin5px">撤销</span>
    </div>
    <div class="head-left-redo pointer not-allowed">
      <span class="font12 margin5px">重做</span>
      <span class="fa dedede fa-mail-forward fa-lg"></span>
    </div>
  </div>
  <div class="head-center">
    <div data-type="6">
      <span class="fa fa-file-text-o fa-lg f66926"></span>
      <p>文本</p>
    </div>
    <!--        <div data-type="6">
                <span class="fa fa-file-powerpoint-o fa-lg f66926"></span>
                <p>文本</p>
            </div>-->
    <div data-type="2">
      <span class="fa fa-photo fa-lg f66926"></span>
      <p>图片</p>
    </div>
    <div data-type="8">
      <span class="fa fa-film fa-lg f66926"></span>
      <p>视频</p>
    </div>
    <!--        <div>
                <span class="fa fa-music fa-lg f66926"></span>
                <p>音频</p>
        </div>
    -->
  </div>
  <div class="head-right">
    <div class="pointer hover-shadow2" id="to-preview">
      <span class="fa fa-eye f66926 fa-lg"></span>
      <span> 预览模式</span>
    </div>
    <div class="pointer hover-shadow2" id="to-draft">
      <span class="fa fa-save f66926 fa-lg"></span>
      <span> 保存</span>
    </div>
    <div id="to-publish" class="pointer orange hover-color hover-shadow2">
      <span class="fa fa-paper-plane-o  fa-lg"></span>
      <span> 发布活动</span>
    </div>
  </div>
</header>

<!--主要内容（左 中 右)-->
<div id="center-container" class="e-container">

  <!--左侧工具栏fixed-left-->
  <div id="hdj-com">
    <div id="com-left">
      <div class="com-left-type white pointer left-orange-bg" data-type="0">
        <span class="animated fa fa-star fa-lg ani-star"></span>
        <p class="font12">公用素材</p>
      </div>
      <div class="com-left-type white pointer" data-type="1">
        <span class="animated fa fa-user-circle fa-lg ani-people"></span>
        <p class="font12">我的素材</p>
      </div>
    </div>
    <div id="com-right">
      <!--组件模块展示-->
      <div id="com-public-box" class="animated com-rightbox com-coms">
        <div class="com-name">
          <!--类型名称列表-->
          <ul class="com-name-ul">
            <li class="com-li-color" data-tag="11">最新</li>
            <li data-tag="1">标题</li>
            <li data-tag="2">文本</li>
            <li data-tag="10">图文</li>
            <li data-tag="7">分割线</li>
            <li data-tag="6">视频</li>
          </ul>
        </div>
        <div class="com-container">
          <!--AJAX替换的组件模块区-->
          <section id="com-box-11" class="com-box" data-container="source" data-tag="11">
            <div data-type="6" data-layout="1028" class="com-item com-title com-title-1028" style="">
              <div class="com-content ellipsis2" style="">
                <p style="color: #002d68;font-weight: bold;font-size: 14px;">海边的旅行畅享会</p></div>
              <div class="com-icon1">
                <img class="ignore_wx" src="../../images/mgt/edit/com-title1028.png" alt="">
              </div>
            </div>
            <div data-type="10" data-layout="2004" class="com-item com-imgs com-imgs-1004" style="">
              <div class="com-content com-content-img com-content-img1 set-rectangle" style="">
                <img src="../../images/mgt/edit/com-imgs1003-2.png" alt="" style="">
              </div>
              <div class="com-content com-content-img com-content-img2 set-rectangle" style="">
                <img src="../../images/mgt/edit/com-imgs1003.png" alt="" style="">
              </div>
              <div class="com-content com-content-text ellipsis2" style="">
                <section>
                  <p style="text-align: center;color: indianred;font-size: 14px">音乐时光<br>8月8日<br></p></section>
              </div>
              <div class="com-border1 set-rectangle"></div>
            </div>
            <div data-type="6" data-layout="2005" class="com-item com-txt com-title-2005" style="">
              <div>
                <img class="ignore_wx" src="../../images/mgt/edit/com-txt3.png" alt="">
              </div>
              <div class="com-content" style="">
                <p>请输入文字</p></div>
            </div>
            <div data-type="6" data-layout="1016" class="com-item com-title com-title-1016" style="">
              <div class="com-content ellipsis" style="">
                <p style="text-align: center">输入标题</p></div>
              <div>
                <img class="ignore_wx" src="../../images/mgt/edit/com-title15.png" alt="">
              </div>
            </div>
            <div data-type="10" data-layout="2005" class="com-item com-imgs com-imgs-1005" style="">
              <div class="com-content com-content-img com-content-img1 set-rectangle" style="">
                <img src="../../images/mgt/edit/com-imgs1005-1.png" alt="" style="">
              </div>
              <div class="com-content com-content-img com-content-img2 set-rectangle" style="">
                <img src="../../images/mgt/edit/com-imgs1005-2.png" alt="" style="">
              </div>
              <div class="com-content com-content-text ellipsis2" style="">
                <section>
                  <p style="text-align: center;color: indianred;font-size: 14px">芭蕾舞<br>12月23日<br></p></section>
              </div>
              <div class="com-border1 set-rectangle"></div>
            </div>
            <div data-type="6" data-layout="2011" class="com-item com-txt com-title-2011" style="">
              <div class="com-content" style="">
                <p>请输入文字</p></div>
              <div class="com-border1"></div>
              <div class="com-border2"></div>
            </div>
            <div data-type="2" data-layout="1031" class="com-item com-line com-line1031" style="">
              <div class="com-content" style="">
                <img class="ignore_wx" src="../../images/mgt/edit/com-line31.png" style="" alt="">
                <p></p>
              </div>
            </div>
            <div data-type="6" data-layout="2006" class="com-item com-txt com-title-2006" style="">
              <div>
                <img class="ignore_wx" src="../../images/mgt/edit/com-txt6.png" alt="">
              </div>
              <div class="com-content" style="">
                <p>请输入文字</p></div>
              <div class="com-border1"></div>
            </div>
            <div data-type="6" data-layout="2020" class="com-item com-txt com-title-2020" style="">
              <div class="com-content" style="">
                <p>【活动时间】：2016年8月13日<br>【活动地点】：厦门市湖里区华泰路<br>【活动收费】：免费参与<br>【活动人数】：20人（名额有限哦）<br>【报名截止时间】：2016年8月11日<br></p></div>
              <div class="com-icon1">
                <img class="ignore_wx" src="../../images/mgt/edit/com-txt2020-top.png" alt="">
              </div>
              <div class="com-icon2">
                <img class="ignore_wx" src="../../images/mgt/edit/com-txt2020-bottom.png" alt="">
              </div>
            </div>
            <div data-type="6" data-layout="1029" class="com-item com-title com-title-1029" style="">
              <div class="com-icon1">
                <img class="ignore_wx" src="../../images/mgt/edit/com-title1029-1.png" alt="">
              </div>
              <div class="com-content" style="">
                <p style="color: #002d68;font-weight: bold;font-size: 18px;">场景介绍</p></div>
              <div class="com-icon2">
                <img class="ignore_wx" src="../../images/mgt/edit/com-title1029-2.png" alt="">
              </div>
            </div>
          </section>
        </div>
      </div>

      <!--我的素材模块展示-->
      <div id="com-my-box" class="animated com-rightbox none">
        <div class="com-material-title">
          <div id="com-my-images-tab">
            <span class="hover-f66926 com-box-title-clicked">我的图库</span>
          </div>
          <div id="com-my-material-tab">
            <span class="hover-f66926">素材收藏</span>
          </div>
        </div>
        <div class="com-my-container">
          <!--素材收藏-->  <!--我的图库-->
          <section id="left-myimg" class="animated com-my-images com-box animated-fast">
            <div id="com-left-gallery" class="com-my-gallery">
              <section id="com-left-gallery-section" data-container="source" class="left-gallery-box">

              </section>
            </div>
            <!--<div class="com-gallery-tip">点击相应图片即可替换</div>-->
          </section>
          <!--个人素材列表-->
          <section id="left-shoucang" data-container="source" class="animated com-my-material com-box animated-fast none">
          </section>
        </div>
        <div class="com-left-upload" onclick="$(&#39;#my-img-upload-left&#39;).trigger(&#39;click&#39;);">
          <span class="fa fa-photo fa-lg"></span>
          <span> 上传图片</span>
        </div>
        <input accept="image/jpeg,image/png" hidden="" id="my-img-upload-left" type="file" multiple="multiple">
      </div>
    </div>
  </div>

  <!--中间预览区center-->
  <div id="hdj-preview" class="">
    <!--<div class="center-scale-box">-->
    <!--<span title="放大/缩小预览区" data-value="0" class="fa fa-search-plus fa-lg pointer hover-f66926"  onclick="previewBoxScale(this);"></span>-->
    <!--</div>-->
    <!--活动设置-->
    <div class="clearfloat"></div>
    <div class="center-slide slide-basic" data-type="open" onclick="centerViewToggle(this,&#39;#view-top&#39;)">
      <span class="fa fa-chevron-down"></span>
      <span>基本设置</span>
    </div>

    <section id="view-top">
      <div class="view-banner" onclick="basicTab(1);">
        <!--<img id="center_basic_banner" class="view-banner-img" src="/Public/image/www/beijingtu2.png" alt="活动海报">-->
        <img id="center_basic_banner" class="view-banner-img" src="../../images/mgt/edit/preview/default-poster.png" alt="活动海报">
      </div>
      <div class="view-title" onclick="basicTab(1);">
        <h3 id="center_basic_title">请设置活动标题</h3>
      </div>
      <div class="view-basic view-organizer" onclick="basicTab(1);">
        <img src="../../images/mgt/edit/hdxq-wode.png" alt="">
        <span id="center_basic_organizer">寻找韩然</span>
      </div>
      <div class="view-basic view-price" onclick="basicTab(2);">
        <img src="../../images/mgt/edit/hdxq-jiage.png" alt="">
        <span id="center_basic_price">免费</span>
      </div>
      <div class="view-basic view-date" onclick="basicTab(1);">
        <img src="../../images/mgt/edit/hdxq-shijian.png" alt="">
        <span id="center_basic_time">请设置活动时间</span>
      </div>
      <div class="view-address" onclick="basicTab(1);">
        <img src="../../images/mgt/edit/dinwgeigray.png" alt="">
        <span id="center_basic_address">请设置活动地点</span>
      </div>
    </section>
    <section id="view-detail-box" class="view_detail_container">
      <div id="init-introduce" style="text-align:center;font-size: 16px;">
        <div><strong>←从左侧点击或拖拽素材到此</strong></div>
      </div>
    </section>
    <section class="view-init-box">
      <div class="init-com-item" id="init-com-item" style="">
        <div class="com-content">快速插入内容</div>
      </div>
    </section>
  </div>

  <!--右侧编辑区fixed-right-->
  <!--udraggable拖拽编辑模块的容器-->
  <!--<div class="udraggable-box">-->
  <div id="hdj-edit" class="hdj-edit-container">

    <!--默认的编辑-->
    <section id="hdj-edit-basic" class="hdjedit-basic right-boxshadow" style="position: fixed; top: 95px; left: 1149px; right: auto; bottom: auto;">
      <div>
        <div class="edit-title" style="cursor: default;">
          <span class="fa fa-cog"></span>
          <span>活动设置</span>
        </div>
        <div class="basic-tab">
          <div class="inlineblock">
            <div onclick="basicTab(1)" id="base-setting" class="basic-tab-1 basic-tab-div inlineblock pointer basic-tab-click">基本信息</div>
          </div>
          <div class="inlineblock">
            <div onclick="basicTab(2)" id="sign-setting" class="basic-tab-2 basic-tab-div inlineblock pointer">报名设置</div>
          </div>
        </div>
      </div>
      <div id="nice-scroll-right" class="edit-basic-box scroll-pane">
        <div class="basic-tab-content">
          <!--tab 基本信息 编辑-->
          <div class="animated edit-basic animated-fast ">
            <div class="edit-basic-padding">
              <div class="basic-section">
                <p class="basic-title-p">活动海报（必填）</p>
                <div class="basic-banner-container">
                  <div class="basic-banner-imgdiv inlineblock">
                    <img id="right_basic_banner" data-value="default" src="../../images/mgt/edit/default-poster.png" alt="">
                  </div>
                  <div class="basic-banner-btndiv inlineblock">
                    <div>
                      <button onclick="banner.change()" class="pointer" id="banner-change-btn">更改海报</button>
                      <button onclick="poster.open()" class="pointer right-btn-color" id="banner-box-btn">海报模板</button>
                      <!--上传海报-->
                      <input accept="image/jpeg,image/png" hidden="" onchange="banner.previewImage(this);" id="banner-upload" type="file" multiple="multiple">
                    </div>
                    <p>推荐尺寸900*428，大小4m以内，
                      <br>支持png、jpg格式。</p>
                  </div>
                </div>
              </div>
              <div class="basic-section">
                <p class="basic-title-p">活动标题（必填）</p>
                <input id="right_basic_title" class="input-style basic-title-input" type="text" maxlength="80" placeholder="请设置您的活动标题（5 - 80个字）">
              </div>
              <div class="basic-section">
                <p class="basic-title-p">活动时间（必填）</p>
                <div class="basic-date">
                  <div class="basic-input-div">
                    <input id="right_basic_start_date" type="text" class="basic-datetime" placeholder="开始时间">
                    <img src="../../images/mgt/edit/basic-time-icon.png" alt="">
                  </div>
                  <div class="basic-input-div">
                    <input id="right_basic_end_date" type="text" class="basic-datetime" placeholder="结束时间">
                    <img src="../../images/mgt/edit/basic-time-icon.png" alt="">
                  </div>
                  <span class="basic-time-line"></span>
                </div>
                <div class="basic-date">
                  <div style="padding-top: 8px;border: none">
                    <div class="basic-toggle-box pointer" id="basic-time-toggle">
                      <div id="right_basic_deadline_switch" data-value="1" class="basic-toggle-icon pointer" style="left: 15px;"></div>
                    </div>
                    <span>活动结束前均可报名</span>
                  </div>
                  <div id="stop-time-input" class="basic-input-div" style="display: none">
                    <input id="right_basic_deadline_date" type="text" class="basic-datetime" placeholder="请设置报名截止时间">
                    <img src="../../images/mgt/edit/basic-time-icon.png" alt="">
                  </div>
                </div>
              </div>
              <div class="basic-section">
                <p class="basic-title-p" style="margin-bottom: 0;">活动地点（必填）</p>
                <div class="basic-select-box">
                  <select name="activity" id="right_basic_activity_type" class="activity-select" onchange="activityType()" style="margin-top: 15px">
                    <option value="0" selected="">线下活动</option>
                    <option value="1">线上活动</option>
                  </select>
                  <span class="activity-type-1" style="display: none">（ 线上活动无需填写地址 ）</span>
                  <select name="prov" id="right_basic_prov" class="address-select activity-type-0">
                    <option value="">请选择</option>
                    <option value="北京" data-id="110000">北京</option>
                    <option value="天津" data-id="120000">天津</option>
                    <option value="河北" data-id="130000">河北</option>
                    <option value="山西" data-id="140000">山西</option>
                    <option value="内蒙古" data-id="150000">内蒙古</option>
                    <option value="辽宁" data-id="210000">辽宁</option>
                    <option value="吉林" data-id="220000">吉林</option>
                    <option value="黑龙江" data-id="230000">黑龙江</option>
                    <option value="上海" data-id="310000">上海</option>
                    <option value="江苏" data-id="320000">江苏</option>
                    <option value="浙江" data-id="330000">浙江</option>
                    <option value="安徽" data-id="340000">安徽</option>
                    <option value="福建" data-id="350000">福建</option>
                    <option value="江西" data-id="360000">江西</option>
                    <option value="山东" data-id="370000">山东</option>
                    <option value="河南" data-id="410000">河南</option>
                    <option value="湖北" data-id="420000">湖北</option>
                    <option value="湖南" data-id="430000">湖南</option>
                    <option value="广东" data-id="440000">广东</option>
                    <option value="广西" data-id="450000">广西</option>
                    <option value="海南" data-id="460000">海南</option>
                    <option value="重庆" data-id="500000">重庆</option>
                    <option value="四川" data-id="510000">四川</option>
                    <option value="贵州" data-id="520000">贵州</option>
                    <option value="云南" data-id="530000">云南</option>
                    <option value="西藏" data-id="540000">西藏</option>
                    <option value="陕西" data-id="610000">陕西</option>
                    <option value="甘肃" data-id="620000">甘肃</option>
                    <option value="青海" data-id="630000">青海</option>
                    <option value="宁夏" data-id="640000">宁夏</option>
                    <option value="新疆" data-id="650000">新疆</option>
                    <option value="香港" data-id="810000">香港</option>
                    <option value="澳门" data-id="820000">澳门</option>
                  </select>
                  <select name="city" id="right_basic_city" class="address-select" style="display: none">
                  </select>
                  <select name="dist" id="right_basic_dist" class="address-select" style="display: none;">
                  </select>
                </div>
                <div id="basic-amap-input" class="basic-stree pointer none">
                  <input type="hidden" id="addr-lng">
                  <input type="hidden" id="addr-lat">
                  <input class="pointer" readonly="" id="detailAddr" type="text" placeholder="请填写活动的详情地址，如：街道/巷/楼/层等">
                  <img class="pointer" id="detailAddr-icon" src="../../images/mgt/edit/fb-006.png" alt="">
                </div>
              </div>
              <div class="basic-section">
                <p class="basic-title-p">活动主办方</p>
                <!--P 存主办方ID-->
                <div class="basic-organizer-box">
                  <img src="../../data/mgt/0" alt="">
                  <p id="right_basic_organizer" data-id="6e0afa">寻找韩然</p>
                  <button onclick="layerSetSponsor()" class="pointer">选择</button>
                </div>
              </div>
              <div class="basic-section">
                <p class="basic-title-p">推广设置</p>
                <div class="basic-toggle">
                  <div id="basic_recommend" class="basic-toggle-box pointer">
                    <div id="right_basic_recommend" data-value="1" class="basic-toggle-icon pointer" style="left: 15px;"></div>
                  </div>
                  <span>允许活动聚推广</span>
                </div>
                <!--<div class="basic-toggle">-->
                <!--<div id="domain-name-toggle" class="basic-toggle-box pointer">-->
                <!--<div data-value="1" class="basic-toggle-icon pointer"></div>-->
                <!--</div>-->
                <!--<span>个性化站点域名</span>-->
                <!--</div>-->
                <!--<div class="domain-box none">-->
                <!--<span>http://</span>-->
                <!--<input type="text" placeholder="请设置您的域名">-->
                <!--<span>.huodongju.com</span>-->
                <!--</div>-->
              </div>
            </div>
          </div>

          <!--tab 报名设置 编辑-->
          <div class="animated edit-join  animated-fast none">
            <div class="edit-basic-padding" style="border-bottom: 2px solid #f8f8f8">
              <div class="basic-section" id="right_basic_sign_type" data-value="0">
                <span>参与方式</span>
                <div class="join-way pointer orange hover-shadow2" data-value="0">在线报名</div>
                <div class="join-way pointer hover-shadow2" data-value="2">其它方式</div>
                <div class="join-way pointer hover-shadow2" data-value="1">无需报名</div>
              </div>
            </div>

            <section class="tab-join-way tab-join-online">
              <div class="basic-section edit-ticket">
                <p>票券设置</p>
                <div class="ticket-box ticket-box-title">
                  <div class="ticket-name">票券名称</div>
                  <div class="ticket-price">价格</div>
                  <div class="ticket-num">总数</div>
                  <div class="ticket-quata">限购</div>
                  <div class="ticket-check">审核</div>
                  <div class="ticket-other">其它</div>
                </div>
                <div id="ticket_list" class="basic-ticket-box">
                  <section class="ticket-box">
                    <div class="ticket-name">免费票</div>
                    <div class="ticket-price">免费</div>
                    <div class="ticket-num">不限</div>
                    <div class="ticket-lnum">不限购</div>
                    <div class="ticket-check">否</div>
                    <div class="ticket-other"><span onclick="layerEditTicket(this)" class="fa fa-edit fa-lg f66926 ticket-edit-btn" style="position: relative;top: 1px;"></span><span
                        class="fa fa-trash-o fa-lg f66926 ticket-delete-btn" onclick="deleteTicket(this)"></span></div>
                  </section>
                </div>
                <div class="new-ticket-btn-box">
                  <button id="right_basic_add_ticket_btn" class="join-btn new-ticket-charge pointer" onclick="layerNewTicket()">
                    <span>+</span>
                    <span>添加票券</span>
                  </button>
                </div>
              </div>
              <div class="basic-section edit-ticket">
                <p>报名填写</p>
                <div class="input-box ticket-box-title">
                  <div class="i-type">类型</div>
                  <div class="i-name">选项名称</div>
                  <div class="i-msg">填写提示</div>
                  <div class="i-other">其它</div>
                </div>
                <div class="bacic-option-box">
                  <!--                                        <section class="input-box input-box2">
                                                              <div class="i-type">
                                                                  <span class="fa f66926 fa-lg fa-circle-thin"></span>
                                                                  <span> 必填</span>
                                                              </div>
                                                              <div class="i-name">
                                                                  姓名
                                                              </div>
                                                              <div class="i-msg i-msg2">
                                                                  <input disabled class="i-msg-input" type="text" placeholder="请输入您的姓名">
                                                              </div>
                                                              <div class="i-other">
                                                                  <span class="fa fa-trash-o fa-lg dedede not-allowed"></span>
                                                              </div>
                                                          </section>
                                                          <section class="input-box input-box2">
                                                              <div class="i-type">
                                                                  <span class="fa f66926 fa-lg fa-circle-thin"></span>
                                                                  <span> 必填</span>
                                                              </div>
                                                              <div class="i-name">
                                                                  手机号码
                                                              </div>
                                                              <div class="i-msg i-msg2">
                                                                  <input disabled class="i-msg-input" type="text" placeholder="请输入您的手机号码">
                                                              </div>
                                                              <div class="i-other">
                                                                  <span class="fa fa-trash-o fa-lg dedede not-allowed"></span>
                                                              </div>
                                                          </section>-->
                  <section class="input-box input-box2" data-type="_name">
                    <div class="i-type"><span data-type="1" class="fa fa-check-circle f66926 fa-lg" onclick="optionSelected(this)"></span><span>必填</span></div>
                    <div class="i-name i-name2"><input disabled="" class="i-name-input" type="text" placeholder="输入选项名称" value="姓名" style="border: none" maxlength="5"></div>
                    <div class="i-msg i-msg2"><input class="i-msg-input" type="text" placeholder="请填写提示信息"></div>
                    <div class="i-other"><span class="fa fa-trash-o fa-lg f66926 pointer" onclick="deleteOption(this)"></span></div>
                  </section>
                  <section class="input-box input-box2" data-type="_phone">
                    <div class="i-type"><span data-type="1" class="fa fa-check-circle f66926 fa-lg" onclick="optionSelected(this)"></span><span>必填</span></div>
                    <div class="i-name i-name2"><input disabled="" class="i-name-input" type="text" placeholder="输入选项名称" value="电话" style="border: none" maxlength="5"></div>
                    <div class="i-msg i-msg2"><input class="i-msg-input" type="text" placeholder="请填写提示信息"></div>
                    <div class="i-other"><span class="fa fa-trash-o fa-lg f66926 pointer" onclick="deleteOption(this)"></span></div>
                  </section>
                </div>
                <div class="new-ticket-btn-box">
                  <!--<button onclick="basicNewOption()" class="join-btn new-ticket-charge">-->
                  <!--&lt;!&ndash;<span class="fa fa-plus"></span>&ndash;&gt;-->
                  <!--<span>+ 添加选项</span>-->
                  <!--</button>-->
                  <button onclick="" class="join-btn basic-option-btn">
                    <span>+ 添加选项</span>
                  </button>
                  <div class="basic-colla-ul-box">
                    <ul class="basic-colla-ul" id="sign_list">
                      <li class="basic-colla-li" data-type="_phone" style="display: none;"><span>+</span><span>电话</span></li>
                      <li class="basic-colla-li" data-type="_name" style="display: none;"><span>+</span><span>姓名</span></li>
                      <li class="basic-colla-li" data-type="_email"><span>+</span><span>邮箱</span></li>
                      <li class="basic-colla-li" data-type="_idnum"><span>+</span><span>身份证号码</span></li>
                      <li class="basic-colla-li" data-type="_qq"><span>+</span><span>QQ</span></li>
                      <li class="basic-colla-li" data-type="_wx"><span>+</span><span>微信</span></li>
                      <li class="basic-colla-li" data-type="_birth"><span>+</span><span>生日</span></li>
                      <li class="basic-colla-li" data-type="_sex"><span>+</span><span>性别</span></li>
                      <li class="basic-colla-li" data-type="_hobby"><span>+</span><span>爱好</span></li>
                      <li class="basic-colla-li" data-type="_age"><span>+</span><span>年龄</span></li>
                      <li class="basic-colla-li" data-type="_edu"><span>+</span><span>学历</span></li>
                      <li class="basic-colla-li" data-type="_comp"><span>+</span><span>公司</span></li>
                      <li class="basic-colla-li" data-type="_addr"><span>+</span><span>地址</span></li>
                      <li class="basic-colla-li" data-type="_job"><span>+</span><span>职位</span></li>
                      <li class="basic-colla-li" data-type="_income"><span>+</span><span>月收入</span></li>
                      <li class="basic-colla-li" data-type="_blood"><span>+</span><span>血型</span></li>
                      <li class="basic-colla-li" data-type="_school"><span>+</span><span>学校</span></li>
                      <li class="basic-colla-li" data-type="_grade"><span>+</span><span>年级</span></li>
                      <li class="basic-colla-li" data-type="_remarks"><span>+</span><span>备注</span></li>
                      <li class="basic-colla-li" data-type="_custom"><span>+</span><span>自定义</span></li>
                    </ul>
                    <span class="close-option-colla fa f66926 fa-times fa-lg pointer"></span>
                  </div>
                </div>

              </div>
            </section>

            <section class="tab-join-way tab-join-other none">
              <div class="tab-join-title">
                <div class="tab-join-title-icon">
                  <img src="../../images/mgt/edit/orangeline.png" alt="">
                  <span>费用类型</span>
                </div>
                <div class="tab-join-btns" id="other_fee_option" data-value="1">
                  <div class="tab-other-free-btn orange pointer hover-shadow2" data-value="1">免费</div>
                  <div class="tab-other-charge-btn pointer hover-shadow2" data-value="2">收费</div>
                </div>
              </div>
              <div class="tab-join-title">
                <div class="tab-join-title-icon">
                  <img src="../../images/mgt/edit/orangeline.png" alt="">
                  <span>参与说明</span>
                </div>
              </div>
              <div class="tab-join-other-content">
                <textarea id="other_content" class="tab-join-other-textarea" placeholder="请认真填写参与活动的具体方式，以便他人更好的参与你的活动"></textarea>
                <div class="tab-join-other-btns">
                  <div data-id="phone" data-type="0" class="tab-contact-btn pointer">+<span>手机号</span></div>
                  <div data-id="weixin" data-type="0" class="tab-contact-btn pointer">+<span>微信号</span></div>
                  <div data-id="qq" data-type="0" class="tab-contact-btn pointer">+<span>QQ号</span></div>
                  <div data-id="tel" data-type="0" class="tab-contact-btn pointer">+<span>固定电话</span></div>
                  <div data-id="web" data-type="0" class="tab-contact-btn pointer">+<span>报名网址</span></div>
                  <div data-id="mail" data-type="0" class="tab-contact-btn pointer">+<span>邮箱</span></div>
                  <div data-id="more" data-type="0" class="tab-contact-btn pointer">+<span>自定义</span></div>
                </div>
                <div id="other-sign-more-add" style="display: none;">
                  <p>
                    <input class="other-sign-more-label" name="other-sign-more-label" value="" placeholder="其他">
                    <input class="other-sign-more-value" name="other-sign-more-value" value="" placeholder="联系方式">
                    <button class="other-sign-more-yes">确定</button>
                  </p>
                </div>
                <div id="other_infos" class="tab-contact-way-box">
                </div>
              </div>
            </section>

            <section class="tab-join-way tab-join-noneed none">
              <div class="tab-join-title">
                <div class="tab-join-title-icon">
                  <img src="../../images/mgt/edit/orangeline.png" alt="">
                  <span>费用类型</span>
                </div>
                <div class="tab-join-btns" id="without_fee_option" data-value="1">
                  <div class="tab-other-free-btn orange pointer hover-shadow2" data-value="1">免费</div>
                  <div class="tab-other-charge-btn pointer hover-shadow2" data-value="2">收费</div>
                </div>
              </div>
              <div class="tab-join-title">
                <div class="tab-join-title-icon">
                  <img src="../../images/mgt/edit/orangeline.png" alt="">
                  <span>参与说明</span>
                </div>
              </div>
              <div class="tab-join-noneed-txt font12">
                <span>参与者不需要填写报名信息直接就能参加你的活动</span>
              </div>
            </section>
          </div>
        </div>
      </div>
      <div class="basic-bottom-div">
        <button id="right_basic_save" class="basic-save-btn orange">保存</button>
        <button class="basic-cancel-btn right-btn-color">取消</button>
      </div>
    </section>

    <!--文本编辑-->
    <section id="hdj-edit-txt" class="edit-txt right-boxshadow none" style="left: 749px;">
      <div class="edit-title">
        <span>文本属性</span>
        <span> </span>
      </div>
      <div class="ue-box-div">
        <script id="ue-container" name="content" type="text/plain" style="height: 433px;"></script>
      </div>
      <div class="save-cancel-btns">
        <button class="g-save-btn orange hover-color">保存</button>
        <button class="g-cancel-btn right-btn-color hover-color">取消</button>
      </div>
    </section>

    <!--富文本编辑-->
    <section id="hdj-edit-html" class="edit-txt right-boxshadow none" style="left: 749px;">
      <div class="edit-title">
        <!--<span class="fa fa-cog"></span>-->
        <span>文本属性</span>
      </div>
      <div class="ue-box-div">
        <script id="ue-container-html" name="content" type="text/plain" style="height: 433px;"></script>
      </div>
      <div class="save-cancel-btns">
        <button class="g-save-btn orange hover-color">保存</button>
        <button class="g-cancel-btn right-btn-color hover-color">取消</button>
      </div>
    </section>

    <!--单图编辑-->
    <section id="hdj-edit-img" class="edit-img edit-model none" style="left: 749px;">
      <div class="edit-title">
        <!--<span class="fa fa-cog"></span>-->
        <span>图片属性</span>
      </div>
      <div class="edit-img-content edit-wrap">
        <div class="edit-img-box">
          <img src="../../images/mgt/edit/xxx.jpg" alt="">
          <div class="edit-imgs-bottom float-btn">
            <div class="edit-imgs-change">替换</div>
            <div class="edit-imgs-crop">裁剪</div>
            <div class="edit-imgs-rotate">旋转</div>
          </div>
        </div>
        <!--                <div class="edit-textarea-box">
                            <textarea name="" id="" placeholder="点此可以添加描述文字"></textarea>
                        </div>-->
      </div>
      <div class="save-cancel-btns">
        <button class="g-save-btn orange hover-color">保存</button>
        <button class="g-cancel-btn right-btn-color hover-color">取消</button>
      </div>
    </section>

    <!--多图编辑-->
    <section id="hdj-edit-imgs" class="edit-imgs edit-model none" style="left: 749px;">
      <div class="edit-title">
        <!--<span class="fa fa-cog"></span>-->
        <span>图片属性</span>
      </div>
      <div class="edit-imgs-content edit-wrap">
        <!--ul li-->
        <div class="edit-imgs-add-btn">
          <button>+ 添加图片</button>
        </div>
      </div>
      <div class="save-cancel-btns">
        <button class="g-save-btn orange hover-color">保存</button>
        <button class="g-cancel-btn right-btn-color hover-color">取消</button>
      </div>
    </section>

    <!--视频编辑-->
    <section id="hdj-edit-video" class="edit-video edit-model none" style="left: 749px;">
      <div class="edit-title">
        <!--<span class="fa fa-cog"></span>-->
        <span>视频属性</span>
      </div>
      <div class="edit-video-div none">

      </div>
      <div class="edit-video-content">
        <p style="text-align: right;font-size: 12px">
          <span style="float: left">视频地址</span>
          <span>什么是</span><a href="http://www.huodongju.com/Public/static/www/help_video.html#publish-media" target="_blank"><span style="color:#F66926;" title="在视频页面点击分享给好友按钮旁边的三角块，复制通用代码">通用代码?</span></a>
        </p>
        <div class="edit-video-t-box">
          <textarea class="edit-video-textarea" placeholder="请粘贴视频代码，支持优酷、腾讯、爱奇艺"></textarea>
        </div>
      </div>
      <div class="edit-video-error none">
        <span class="fa fa-exclamation-circle fa-2x"></span>
        <span> 视频链接解析错误，请输入正确的地址</span>
      </div>

      <div class="save-cancel-btns">
        <button class="g-save-btn orange hover-color">保存</button>
        <button class="g-cancel-btn right-btn-color hover-color">取消</button>
      </div>
    </section>

    <!--分割线编辑-->
    <section id="hdj-edit-line" class="edit-line edit-model none" style="left: 749px;">
      <div class="edit-title">
        <!--<span class="fa fa-cog"></span>-->
        <span>分割线属性</span>
      </div>
      <div class="edit-line-content edit-wrap">
        <p>  颜色选择</p>
        <div class="edit-color-box">
          <div class="edit-color-item edit-color1 hover-shadow" data-color="#000000">
            <div class="color-clicked"></div>
          </div>
          <div class="edit-color-item edit-color2 hover-shadow" data-color="#f66926">
            <div></div>
          </div>
          <div class="edit-color-item edit-color3 hover-shadow" data-color="#65CE67">
            <div></div>
          </div>
          <div class="edit-color-item edit-color4 hover-shadow" data-color="#3995FF">
            <div></div>
          </div>
          <div class="edit-color-item edit-color5 hover-shadow" data-color="#FFBF0E">
            <div></div>
          </div>
          <div class="edit-color-item edit-color6 hover-shadow" data-color="#FF5E5E">
            <div></div>
          </div>
          <div class="edit-color-item edit-color7 hover-shadow" data-color="#7070FD">
            <div></div>
          </div>
          <div class="edit-color-item edit-color8 hover-shadow" data-color="#2CC6A5">
            <div></div>
          </div>
        </div>
        <div class="edit-other-color">
          <p style="margin-bottom: 8px">自定义颜色</p>
          <div>
            <input id="color-picker">
          </div>
        </div>
      </div>
      <div class="save-cancel-btns">
        <button class="g-save-btn orange hover-color">保存</button>
        <button class="g-cancel-btn right-btn-color hover-color">取消</button>
      </div>

      <input id="edit_color_string" type="hidden" value="">
    </section>
  </div>
  <!--</div>-->
</div>

<!--↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 以下为弹窗代码 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓-->

<!-- 地图加载 -->
<div class="lay-box" id="map-wrap">
  <div class="map-content">
    <div class="map-input">
      <input id="map-province" type="hidden">
      <input id="map-city" type="hidden">
      <input id="map-area" type="hidden">
      <input id="map-lng" type="hidden">
      <input id="map-lat" type="hidden">
      <input id="tipinput" placeholder="点击这里可以输入你想要的定位地址">
      <button id="map-input-search"><i class="fa fa-map-marker"></i>搜索</button>
    </div>
    <div class="map-box">
      <div id="container" class="amap-container" style="background: rgb(252, 249, 242);">
        <object style="display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1;" type="text/html" data="about:blank"></object>
        <div class="amap-maps">
          <div class="amap-drags">
            <div class="amap-layers" style="transform: translateZ(0px);">
              <div class="amap-markers" style="position: absolute; z-index: 120; top: 0px; left: 0px;"></div>
              <canvas class="amap-labels" draggable="false" width="0" height="0" style="position: absolute; z-index: 99; height: 0px; width: 0px; top: 0px; left: 0px;"></canvas>
            </div>
            <div class="amap-overlays"></div>
          </div>
        </div>
        <div style="display: none;"></div>
        <div class="amap-controls"></div>
        <a class="amap-logo" href="http://gaode.com/" target="_blank"><img src="../../images/mgt/edit/autonavi.png"></a>
        <div class="amap-copyright" style="display: none;"><!--v1.3.28--> © 2018 AutoNavi <span class="amap-mcode">- GS(2016)710号</span></div>
      </div>
    </div>
    <div class="map-tip-shadow"></div>
    <div class="map-tip">
      <div>
        <div class="tip-icon"><i class="fa fa-map-o"></i></div>
        <p id="tip-title-addr">当前定位：请输入或选择地址</p>
      </div>
      <button id="tip-btn" class="not-click">使用该地址</button>
    </div>
  </div>
  <div class="map-footer">
    <button id="save-addr">确定</button>
    <button id="cacel-addr">取消</button>
  </div>
</div>
<!--裁剪弹窗-->
<div class="lay-box lay-jcrop-box" id="lay-banner-upload">
  <div class="j-imgbox" id="jcrop-preview">
    <img id="imghead" class="j-img" src="http://www.huodongju.com/Studio/index">
  </div>
</div>
<!--裁剪获取原图尺寸的img-->
<img style="display: none" id="imgFullSize" src="http://www.huodongju.com/Studio/index">
<!--海报模板-->
<div class="lay-box" id="lay-banner-box">
  <div class="lay-bannerbox">
    <div class="lay-banner-type">
      <div onclick="bannerListScroll.moveTop()" class="lay-banner-type-arrow lay-banner-type-arrow-top">
        <span class="fa fa-chevron-up dedede"></span>
      </div>
      <div class="lay-banner-ul-box">
        <ul id="lay-banner-type-id" class="lay-banner-type-ul">
          <!--AJAX海报类型名称-->
        </ul>
      </div>
      <div onclick="bannerListScroll.moveBottom()" class="lay-banner-type-arrow lay-banner-type-arrow-bottom">
        <span class="fa fa-chevron-down dedede"></span>
      </div>
    </div>
    <div class="lay-banner-content">
      <ul id="lay-banner-content-id" class="lay-banner-content-ul">
        <!--AJAX海报图片-->
        <!--<li>-->
        <!--<img class="lay-banner-img" src="" alt="">-->
        <!--</li>-->
      </ul>
    </div>
  </div>
</div>
<!--选择主办方-->
<div class="lay-box" id="lay-set-sponsor">
  <div class="lay-content-box">
    <div class="lay-sponsor-head">
      <div class="inlineblock f66926 lay-sponsor-head-left pointer">
        <span class="fa fa-refresh fa-lg v-middle"></span>
        <span class="text-hover" onclick="organizer.refreshList()"> 刷新主办方</span>
      </div>
      <div class="inlineblock f66926 lay-sponsor-head-right pointer">
        <span class="text-hover" style="position: relative;top: 2px" onclick="pageSkip.openOrganizerList()">主办方管理 </span>
        <span class="v-middle fa fa-angle-right fa-lg"></span>
      </div>
    </div>
    <div id="lay-sponsor-ajax" class="lay-sponsor-box">

    </div>

  </div>
</div>
<!--新增票券-->
<div class="lay-box" id="lay-new-ticket" style="height: 480px;">
  <div class="lay-content-box lay-ticket-box" style="height: 480px">
    <input id="lay_ticket_id" value="" type="hidden">
    <input id="lay_ticket_index" value="" type="hidden">
    <section class="lay-new-ticket">
      <div class="lay-tic-label">票券类型:</div>
      <div id="lay_ticket_type" data-value="1" class="lay-tic-type">
        <div onclick="newTicketType(this)" data-type="1" class="orange pointer">免费票</div>
        <div onclick="newTicketType(this)" data-type="0" class="right-btn-color pointer">收费票</div>
      </div>
      <div class="lay-tic-unit"></div>
    </section>

    <section class="lay-new-ticket">
      <div class="lay-tic-label">票券名称:</div>
      <div class="lay-tic-input">
        <input id="lay_ticket_title" class="lay-ticket-name-input input-style" type="text" maxlength="8" placeholder="请输入票券名称（不超过8个字）">
      </div>
      <div class="lay-tic-unit"></div>
    </section>

    <!--新增的票券说明-->
    <section class="lay-new-ticket">
      <div class="lay-tic-label">票券说明:</div>
      <div class="lay-tic-input">
        <input id="lay_ticket_describe" class="lay-ticket-name-input input-style" type="text" maxlength="15" placeholder="请输入票券说明（不超过15个字）">
      </div>
      <div class="lay-tic-unit"></div>
    </section>

    <section class="lay-new-ticket">
      <div class="lay-tic-label">票券价格:</div>
      <div class="lay-tic-input">
        <input placeholder="免费" disabled="" id="lay_ticket_price" class="lay-ticket-price-input input-style" onkeyup="checknum(this)" type="text" oninput="if(value.length&gt;6)value=value.slice(0,6)">
      </div>
      <div class="lay-tic-unit">元</div>
    </section>

    <section class="lay-new-ticket">
      <div class="lay-tic-label">总数:</div>
      <div class="lay-tic-input">
        <input maxlength="5" placeholder="默认为不限总数" id="lay_ticket_tnum" class="lay-ticket-price-input input-style" type="text" onkeyup="this.value=this.value.replace(/\D/g,&#39;&#39;)"
               onafterpaste="this.value=this.value.replace(/\D/g,&#39;&#39;)">
      </div>
      <div class="lay-tic-unit">张 （选填）</div>
    </section>

    <section class="lay-new-ticket">
      <div class="lay-tic-label">限购:</div>
      <div class="lay-tic-input">
        <input maxlength="5" placeholder="默认为不限购" id="lay_ticket_lnum" class="lay-ticket-price-input input-style" type="text" onkeyup="this.value=this.value.replace(/\D/g,&#39;&#39;)"
               onafterpaste="this.value=this.value.replace(/\D/g,&#39;&#39;)">
      </div>
      <div class="lay-tic-unit">张 / 人 （选填）</div>
    </section>

    <section class="lay-new-ticket">
      <div class="lay-tic-label">票券审核:</div>
      <div class="basic-toggle">
        <div id="lay-ticket-check" class="basic-toggle-box pointer" onclick="toggleCheck(this)">
          <div id="lay_ticket_audit" data-type="0" class="basic-toggle-icon pointer"></div>
        </div>
        <span>需要审核报名信息</span>
      </div>
    </section>

  </div>
</div>
<!--我的图库-->
<div class="lay-box" id="lay-myimg-box">
  <div class="lay-bannerbox">
    <div class="lay-banner-type" style="padding: 0">
      <div class="lay-banner-ul-box">
        <ul id="lay-myimg-type-ul" class="lay-banner-type-ul" style="height: auto;position: inherit;">
          <li class="lay-banner-type-click">我的上传</li>
          <!--<li>图片素材</li>-->
          <li>最近使用</li>
        </ul>
        <!--补齐右边框-->
        <div class="lay-border-r"></div>
      </div>
      <div class="lay-myimg-upload pointer hover-orange" onclick="$(&#39;#my-img-upload&#39;).trigger(&#39;click&#39;)">
        <span class="fa fa-cloud-upload fa-lg"></span>
        <span>上传图片</span>
      </div>
      <input accept="image/jpeg,image/png" hidden="" id="my-img-upload" type="file" multiple="multiple">
    </div>
    <div class="lay-banner-content lay-myimg-content">
      <!-- AJAX 我的上传、图片素材、最近使用 ul切换-->
      <div class="lay-myimg-edit">
        <div class="myimg-edit-box none">
                    <span class="myimg-edit-all pointer" data-type="0" onclick="myGallery.chooseAll(this);">
                        <span class="fa fa-square-o fa-lg f66926"></span>
                        <span>全选</span>
                    </span>
          <button onclick="myGallery.delete();" id="lay-myimg-edit-exit" class="f66926">删除选中</button>
        </div>
        <button onclick="myGallery.edit(this);" id="lay-myimg-edit-btn" class="orange" data-type="0">编辑</button>
        <div class="clearfloat"></div>
      </div>
      <div class="lay-myimg-used none">
        <button class="remove-used-btn" onclick="latestImage.empty();">清空</button>
      </div>


      <div>
        <!-- AJAX 我的上传、图片素材、最近使用 ul切换-->
        <ul id="lay-myimg-ul" class="lay-myimg-content-ul" style="height: 408px">
          <!--图片列表-->
        </ul>

        <ul id="lay-lately-ul" class="lay-myimg-content-ul none" style="height: 408px">
          <!--最近使用图片-->
        </ul>
      </div>
    </div>
  </div>
</div>
<!--快速插入视频弹窗-->
<div class="lay-box" id="lay-myvideo-box">
  <section id="hdj-edit-video-pop" class="lay-edit-video">
    <div class="edit-video-content layer-append-video">
      <p style="text-align: right;font-size: 12px">
        <span style="float: left">视频地址</span>
        <span>什么是</span><a href="http://www.huodongju.com/Public/static/www/help_video.html#publish-media" target="_blank"><span class="f66926" title="在视频页面点击分享给好友按钮旁边的三角块，复制通用代码">通用代码?</span></a>
      </p>
      <div class="edit-video-t-box">
        <textarea class="edit-video-textarea" placeholder="请粘贴视频代码，支持优酷、腾讯、爱奇艺"></textarea>
      </div>
    </div>
    <div class="edit-video-error none">
      <span class="fa fa-exclamation-circle fa-2x"></span>
      <span> 视频链接解析错误，请输入正确的地址</span>
    </div>
  </section>
</div>
<!--新手引导弹窗-->
<div class="lay-guide-box none" id="lay-user-guide">
  <div class="guide-img">
    <div data-step="1" class="guide-bg guide-bg1  animated">
      <img src="../../images/mgt/edit/guide1.png" alt="">
      <div class="guide-text">
        <p class="guide-text-1">
          <span class="fa fa-map-signs f66926"></span>
          <span>选择素材</span>
        </p>
        <p class="guide-text-2">
          选择你想要的素材分类<br>
          可【拖拽】组件到预览区
        </p>
      </div>
      <div class="guide-arrow"></div>
      <div class="guide-animate">
        <img src="../../images/mgt/edit/guide-hand.png" alt="">
      </div>
    </div>
    <div data-step="2" class="guide-bg guide-bg2  animated none">
      <img src="../../images/mgt/edit/guide2.png" alt="">
      <div class="guide-text">
        <p class="guide-text-1">
          <span class="fa fa-pencil-square-o f66926"></span>
          <span>图片素材</span>
        </p>
        <p class="guide-text-2">
          【点击】可独立编辑素材的任意组件
        </p>
      </div>
      <div class="guide-arrow"></div>
      <div class="guide-animate">
        <img class="" src="../../images/mgt/edit/guide-hand.png" alt="">
      </div>
    </div>
    <div data-step="3" class="guide-bg guide-bg3  animated none">
      <img src="../../images/mgt/edit/guide-3.png" alt="">
      <div class="guide-text">
        <p class="guide-text-1">
          <span class="fa fa-pencil-square-o animated f66926"></span>
          <span>文本编辑</span>
        </p>
        <p class="guide-text-2">
          【点击】可独立编辑素材的任意组件
        </p>
      </div>
      <div class="guide-arrow"></div>
      <div class="guide-animate">
        <img class="" src="../../images/mgt/edit/guide-hand.png" alt="">
      </div>
    </div>
    <div data-step="4" class="guide-bg guide-bg4  animated none">
      <img src="../../images/mgt/edit/guide4.png" alt="">
      <div class="guide-text">
        <p class="guide-text-1">
          <span class="fa fa-send-o f66926"></span>
          <span>发布活动</span>
        </p>
        <p class="guide-text-2">
          活动即刻发布到活动聚平台
        </p>
      </div>
      <div class="guide-arrow"></div>
      <div class="guide-animate animated pulse" style="animation-iteration-count:infinite;">
        <div>
          <span class="fa fa-send-o"></span>
          <span>发布活动</span>
        </div>
      </div>
    </div>
    <div class="guide-step-icon none">
      <span data-step="1" class="guide-step-orange"></span>
      <span data-step="2"></span>
      <span data-step="3"></span>
      <span data-step="4"></span>
    </div>
  </div>
  <div class="guide-btns">
    <button class="guide-skip">跳过引导</button>
    <button class="guide-next orange" onclick="guideNext()">下一步</button>
  </div>
</div>
<!-- 活动预览弹窗-->
<div class="lay-preview none">
  <div class="lay-preview-left">
    <div class="lay-phone-border">

      <iframe class="lay-iframe" src="" frameborder="0"></iframe>
    </div>
  </div>
  <div class="lay-preview-right">
    <p style="color: white;font-size: 14px">手机扫一扫 预览活动</p>
    <div class="lay-qrcode-box" id="preview_qrcode">
      <!--<img class="lay-qrcode-img" src="/Public/image/www/erweima.png" alt="">-->
    </div>
    <div class="lay-preview-close hover-f66926" onclick="layerClose();">
      <span class="fa fa-times-circle fa-lg"></span>
    </div>
  </div>
</div>

<!--编辑模块拖拽的容器-->
<div id="edit_drag_container"></div>
<script src="../../js/mgt/common/public.js"></script>
<script defer="" src="../../js/mgt/common/qiniu.js"></script>
<!--<script type="text/javascript" charset="utf-8" src="/Public/plugin/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="/Public/plugin/ueditor/editor_api.js"></script>-->
<script src="../../js/mgt/common/ueditor.config.js"></script>
<script defer="" src="../../js/mgt/common/ueditor.all.min.js"></script>
<script defer="" src="../../js/mgt/common/jquery.Jcrop.js"></script>
<script defer="" src="../../js/mgt/common/jquery.datetimepicker.full.min.js"></script>
<script src="../../js/mgt/common/dragula.js"></script>
<!--<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>-->
<script src="../../js/mgt/common/coms.js"></script>  <!-- 组件js -->
<script src="../../js/mgt/common/hdjTools.js"></script>
<script src="../../js/mgt/edit/edit.ajax.js"></script>
<!--<script src="/Public/js/www/editor/edit.data.js?version=20180111"></script>-->
<script defer="" src="../../js/mgt/edit/edit.myImage.js"></script>
<script src="../../js/mgt/edit/edit.zone.js"></script>
<script src="../../js/mgt/edit/edit.basic.js"></script>
<script src="../../js/mgt/edit/edit.js"></script>
<script defer="" type="text/javascript" src="../../data/mgt/maps"></script>
<script defer="" src="../../js/mgt/common/map.js"></script>
<script defer="" src="../../js/mgt/common/undo.js"></script>
<script defer="" src="../../js/mgt/common/qrcode.min.js"></script>

<!--拖拽编辑框-->
<script defer="" src="../../js/mgt/common/jquery.event.ue.js"></script>
<script defer="" src="../../js/mgt/common/jquery.udraggable.js"></script>

<!--颜色选择器-->
<script defer="" type="text/javascript" src="../../data/mgt/stats" charset="UTF-8"></script>

<div class="xdsoft_datetimepicker xdsoft_noselect xdsoft_">
  <div class="xdsoft_datepicker active">
    <div class="xdsoft_mounthpicker">
      <button type="button" class="xdsoft_prev" style="visibility: visible;"></button>
      <button type="button" class="xdsoft_today_button" style="visibility: visible;"></button>
      <div class="xdsoft_label xdsoft_month"><span>一月</span>
        <div class="xdsoft_select xdsoft_monthselect xdsoft_scroller_box">
          <div style="margin-top: 0px;">
            <div class="xdsoft_option xdsoft_current" data-value="0">一月</div>
            <div class="xdsoft_option " data-value="1">二月</div>
            <div class="xdsoft_option " data-value="2">三月</div>
            <div class="xdsoft_option " data-value="3">四月</div>
            <div class="xdsoft_option " data-value="4">五月</div>
            <div class="xdsoft_option " data-value="5">六月</div>
            <div class="xdsoft_option " data-value="6">七月</div>
            <div class="xdsoft_option " data-value="7">八月</div>
            <div class="xdsoft_option " data-value="8">九月</div>
            <div class="xdsoft_option " data-value="9">十月</div>
            <div class="xdsoft_option " data-value="10">十一月</div>
            <div class="xdsoft_option " data-value="11">十二月</div>
          </div>
          <div class="xdsoft_scrollbar">
            <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
          </div>
        </div>
        <i></i></div>
      <div class="xdsoft_label xdsoft_year"><span>2018</span>
        <div class="xdsoft_select xdsoft_yearselect xdsoft_scroller_box">
          <div style="margin-top: 0px;">
            <div class="xdsoft_option " data-value="1950">1950</div>
            <div class="xdsoft_option " data-value="1951">1951</div>
            <div class="xdsoft_option " data-value="1952">1952</div>
            <div class="xdsoft_option " data-value="1953">1953</div>
            <div class="xdsoft_option " data-value="1954">1954</div>
            <div class="xdsoft_option " data-value="1955">1955</div>
            <div class="xdsoft_option " data-value="1956">1956</div>
            <div class="xdsoft_option " data-value="1957">1957</div>
            <div class="xdsoft_option " data-value="1958">1958</div>
            <div class="xdsoft_option " data-value="1959">1959</div>
            <div class="xdsoft_option " data-value="1960">1960</div>
            <div class="xdsoft_option " data-value="1961">1961</div>
            <div class="xdsoft_option " data-value="1962">1962</div>
            <div class="xdsoft_option " data-value="1963">1963</div>
            <div class="xdsoft_option " data-value="1964">1964</div>
            <div class="xdsoft_option " data-value="1965">1965</div>
            <div class="xdsoft_option " data-value="1966">1966</div>
            <div class="xdsoft_option " data-value="1967">1967</div>
            <div class="xdsoft_option " data-value="1968">1968</div>
            <div class="xdsoft_option " data-value="1969">1969</div>
            <div class="xdsoft_option " data-value="1970">1970</div>
            <div class="xdsoft_option " data-value="1971">1971</div>
            <div class="xdsoft_option " data-value="1972">1972</div>
            <div class="xdsoft_option " data-value="1973">1973</div>
            <div class="xdsoft_option " data-value="1974">1974</div>
            <div class="xdsoft_option " data-value="1975">1975</div>
            <div class="xdsoft_option " data-value="1976">1976</div>
            <div class="xdsoft_option " data-value="1977">1977</div>
            <div class="xdsoft_option " data-value="1978">1978</div>
            <div class="xdsoft_option " data-value="1979">1979</div>
            <div class="xdsoft_option " data-value="1980">1980</div>
            <div class="xdsoft_option " data-value="1981">1981</div>
            <div class="xdsoft_option " data-value="1982">1982</div>
            <div class="xdsoft_option " data-value="1983">1983</div>
            <div class="xdsoft_option " data-value="1984">1984</div>
            <div class="xdsoft_option " data-value="1985">1985</div>
            <div class="xdsoft_option " data-value="1986">1986</div>
            <div class="xdsoft_option " data-value="1987">1987</div>
            <div class="xdsoft_option " data-value="1988">1988</div>
            <div class="xdsoft_option " data-value="1989">1989</div>
            <div class="xdsoft_option " data-value="1990">1990</div>
            <div class="xdsoft_option " data-value="1991">1991</div>
            <div class="xdsoft_option " data-value="1992">1992</div>
            <div class="xdsoft_option " data-value="1993">1993</div>
            <div class="xdsoft_option " data-value="1994">1994</div>
            <div class="xdsoft_option " data-value="1995">1995</div>
            <div class="xdsoft_option " data-value="1996">1996</div>
            <div class="xdsoft_option " data-value="1997">1997</div>
            <div class="xdsoft_option " data-value="1998">1998</div>
            <div class="xdsoft_option " data-value="1999">1999</div>
            <div class="xdsoft_option " data-value="2000">2000</div>
            <div class="xdsoft_option " data-value="2001">2001</div>
            <div class="xdsoft_option " data-value="2002">2002</div>
            <div class="xdsoft_option " data-value="2003">2003</div>
            <div class="xdsoft_option " data-value="2004">2004</div>
            <div class="xdsoft_option " data-value="2005">2005</div>
            <div class="xdsoft_option " data-value="2006">2006</div>
            <div class="xdsoft_option " data-value="2007">2007</div>
            <div class="xdsoft_option " data-value="2008">2008</div>
            <div class="xdsoft_option " data-value="2009">2009</div>
            <div class="xdsoft_option " data-value="2010">2010</div>
            <div class="xdsoft_option " data-value="2011">2011</div>
            <div class="xdsoft_option " data-value="2012">2012</div>
            <div class="xdsoft_option " data-value="2013">2013</div>
            <div class="xdsoft_option " data-value="2014">2014</div>
            <div class="xdsoft_option " data-value="2015">2015</div>
            <div class="xdsoft_option " data-value="2016">2016</div>
            <div class="xdsoft_option " data-value="2017">2017</div>
            <div class="xdsoft_option xdsoft_current" data-value="2018">2018</div>
            <div class="xdsoft_option " data-value="2019">2019</div>
            <div class="xdsoft_option " data-value="2020">2020</div>
            <div class="xdsoft_option " data-value="2021">2021</div>
            <div class="xdsoft_option " data-value="2022">2022</div>
            <div class="xdsoft_option " data-value="2023">2023</div>
            <div class="xdsoft_option " data-value="2024">2024</div>
            <div class="xdsoft_option " data-value="2025">2025</div>
            <div class="xdsoft_option " data-value="2026">2026</div>
            <div class="xdsoft_option " data-value="2027">2027</div>
            <div class="xdsoft_option " data-value="2028">2028</div>
            <div class="xdsoft_option " data-value="2029">2029</div>
            <div class="xdsoft_option " data-value="2030">2030</div>
            <div class="xdsoft_option " data-value="2031">2031</div>
            <div class="xdsoft_option " data-value="2032">2032</div>
            <div class="xdsoft_option " data-value="2033">2033</div>
            <div class="xdsoft_option " data-value="2034">2034</div>
            <div class="xdsoft_option " data-value="2035">2035</div>
            <div class="xdsoft_option " data-value="2036">2036</div>
            <div class="xdsoft_option " data-value="2037">2037</div>
            <div class="xdsoft_option " data-value="2038">2038</div>
            <div class="xdsoft_option " data-value="2039">2039</div>
            <div class="xdsoft_option " data-value="2040">2040</div>
            <div class="xdsoft_option " data-value="2041">2041</div>
            <div class="xdsoft_option " data-value="2042">2042</div>
            <div class="xdsoft_option " data-value="2043">2043</div>
            <div class="xdsoft_option " data-value="2044">2044</div>
            <div class="xdsoft_option " data-value="2045">2045</div>
            <div class="xdsoft_option " data-value="2046">2046</div>
            <div class="xdsoft_option " data-value="2047">2047</div>
            <div class="xdsoft_option " data-value="2048">2048</div>
            <div class="xdsoft_option " data-value="2049">2049</div>
            <div class="xdsoft_option " data-value="2050">2050</div>
          </div>
          <div class="xdsoft_scrollbar">
            <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
          </div>
        </div>
        <i></i></div>
      <button type="button" class="xdsoft_next" style="visibility: visible;"></button>
    </div>
    <div class="xdsoft_calendar">
      <table>
        <thead>
        <tr>
          <th>日</th>
          <th>一</th>
          <th>二</th>
          <th>三</th>
          <th>四</th>
          <th>五</th>
          <th>六</th>
        </tr>
        </thead>
        <tbody>
        <tr>
          <td data-date="31" data-month="11" data-year="2017" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_other_month xdsoft_weekend" title="">
            <div>31</div>
          </td>
          <td data-date="1" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>1</div>
          </td>
          <td data-date="2" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>2</div>
          </td>
          <td data-date="3" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>3</div>
          </td>
          <td data-date="4" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>4</div>
          </td>
          <td data-date="5" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>5</div>
          </td>
          <td data-date="6" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>6</div>
          </td>
        </tr>
        <tr>
          <td data-date="7" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>7</div>
          </td>
          <td data-date="8" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>8</div>
          </td>
          <td data-date="9" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>9</div>
          </td>
          <td data-date="10" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>10</div>
          </td>
          <td data-date="11" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>11</div>
          </td>
          <td data-date="12" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date xdsoft_current xdsoft_today" title="">
            <div>12</div>
          </td>
          <td data-date="13" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>13</div>
          </td>
        </tr>
        <tr>
          <td data-date="14" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>14</div>
          </td>
          <td data-date="15" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>15</div>
          </td>
          <td data-date="16" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>16</div>
          </td>
          <td data-date="17" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>17</div>
          </td>
          <td data-date="18" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>18</div>
          </td>
          <td data-date="19" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>19</div>
          </td>
          <td data-date="20" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>20</div>
          </td>
        </tr>
        <tr>
          <td data-date="21" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>21</div>
          </td>
          <td data-date="22" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>22</div>
          </td>
          <td data-date="23" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>23</div>
          </td>
          <td data-date="24" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>24</div>
          </td>
          <td data-date="25" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>25</div>
          </td>
          <td data-date="26" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>26</div>
          </td>
          <td data-date="27" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>27</div>
          </td>
        </tr>
        <tr>
          <td data-date="28" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>28</div>
          </td>
          <td data-date="29" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>29</div>
          </td>
          <td data-date="30" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>30</div>
          </td>
          <td data-date="31" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>31</div>
          </td>
          <td data-date="1" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date xdsoft_other_month" title="">
            <div>1</div>
          </td>
          <td data-date="2" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date xdsoft_other_month" title="">
            <div>2</div>
          </td>
          <td data-date="3" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_other_month xdsoft_weekend" title="">
            <div>3</div>
          </td>
        </tr>
        </tbody>
      </table>
    </div>
    <button type="button" class="xdsoft_save_selected blue-gradient-button" style="display: none;">Save Selected</button>
  </div>
  <div class="xdsoft_timepicker active">
    <button type="button" class="xdsoft_prev"></button>
    <div class="xdsoft_time_box xdsoft_scroller_box">
      <div class="xdsoft_time_variant" style="margin-top: 0px;">
        <div class="xdsoft_time " data-hour="0" data-minute="0">00:00</div>
        <div class="xdsoft_time " data-hour="0" data-minute="30">00:30</div>
        <div class="xdsoft_time " data-hour="1" data-minute="0">01:00</div>
        <div class="xdsoft_time " data-hour="1" data-minute="30">01:30</div>
        <div class="xdsoft_time " data-hour="2" data-minute="0">02:00</div>
        <div class="xdsoft_time " data-hour="2" data-minute="30">02:30</div>
        <div class="xdsoft_time " data-hour="3" data-minute="0">03:00</div>
        <div class="xdsoft_time " data-hour="3" data-minute="30">03:30</div>
        <div class="xdsoft_time " data-hour="4" data-minute="0">04:00</div>
        <div class="xdsoft_time " data-hour="4" data-minute="30">04:30</div>
        <div class="xdsoft_time " data-hour="5" data-minute="0">05:00</div>
        <div class="xdsoft_time " data-hour="5" data-minute="30">05:30</div>
        <div class="xdsoft_time " data-hour="6" data-minute="0">06:00</div>
        <div class="xdsoft_time " data-hour="6" data-minute="30">06:30</div>
        <div class="xdsoft_time " data-hour="7" data-minute="0">07:00</div>
        <div class="xdsoft_time " data-hour="7" data-minute="30">07:30</div>
        <div class="xdsoft_time " data-hour="8" data-minute="0">08:00</div>
        <div class="xdsoft_time " data-hour="8" data-minute="30">08:30</div>
        <div class="xdsoft_time " data-hour="9" data-minute="0">09:00</div>
        <div class="xdsoft_time " data-hour="9" data-minute="30">09:30</div>
        <div class="xdsoft_time " data-hour="10" data-minute="0">10:00</div>
        <div class="xdsoft_time " data-hour="10" data-minute="30">10:30</div>
        <div class="xdsoft_time " data-hour="11" data-minute="0">11:00</div>
        <div class="xdsoft_time " data-hour="11" data-minute="30">11:30</div>
        <div class="xdsoft_time " data-hour="12" data-minute="0">12:00</div>
        <div class="xdsoft_time " data-hour="12" data-minute="30">12:30</div>
        <div class="xdsoft_time " data-hour="13" data-minute="0">13:00</div>
        <div class="xdsoft_time " data-hour="13" data-minute="30">13:30</div>
        <div class="xdsoft_time " data-hour="14" data-minute="0">14:00</div>
        <div class="xdsoft_time " data-hour="14" data-minute="30">14:30</div>
        <div class="xdsoft_time " data-hour="15" data-minute="0">15:00</div>
        <div class="xdsoft_time " data-hour="15" data-minute="30">15:30</div>
        <div class="xdsoft_time " data-hour="16" data-minute="0">16:00</div>
        <div class="xdsoft_time " data-hour="16" data-minute="30">16:30</div>
        <div class="xdsoft_time " data-hour="17" data-minute="0">17:00</div>
        <div class="xdsoft_time " data-hour="17" data-minute="30">17:30</div>
        <div class="xdsoft_time " data-hour="18" data-minute="0">18:00</div>
        <div class="xdsoft_time " data-hour="18" data-minute="30">18:30</div>
        <div class="xdsoft_time " data-hour="19" data-minute="0">19:00</div>
        <div class="xdsoft_time " data-hour="19" data-minute="30">19:30</div>
        <div class="xdsoft_time " data-hour="20" data-minute="0">20:00</div>
        <div class="xdsoft_time " data-hour="20" data-minute="30">20:30</div>
        <div class="xdsoft_time " data-hour="21" data-minute="0">21:00</div>
        <div class="xdsoft_time " data-hour="21" data-minute="30">21:30</div>
        <div class="xdsoft_time " data-hour="22" data-minute="0">22:00</div>
        <div class="xdsoft_time xdsoft_current" data-hour="22" data-minute="30">22:30</div>
        <div class="xdsoft_time " data-hour="23" data-minute="0">23:00</div>
        <div class="xdsoft_time " data-hour="23" data-minute="30">23:30</div>
      </div>
      <div class="xdsoft_scrollbar">
        <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
      </div>
    </div>
    <button type="button" class="xdsoft_next"></button>
  </div>
</div>
<div class="xdsoft_datetimepicker xdsoft_noselect xdsoft_">
  <div class="xdsoft_datepicker active">
    <div class="xdsoft_mounthpicker">
      <button type="button" class="xdsoft_prev" style="visibility: visible;"></button>
      <button type="button" class="xdsoft_today_button" style="visibility: visible;"></button>
      <div class="xdsoft_label xdsoft_month"><span>一月</span>
        <div class="xdsoft_select xdsoft_monthselect xdsoft_scroller_box">
          <div style="margin-top: 0px;">
            <div class="xdsoft_option xdsoft_current" data-value="0">一月</div>
            <div class="xdsoft_option " data-value="1">二月</div>
            <div class="xdsoft_option " data-value="2">三月</div>
            <div class="xdsoft_option " data-value="3">四月</div>
            <div class="xdsoft_option " data-value="4">五月</div>
            <div class="xdsoft_option " data-value="5">六月</div>
            <div class="xdsoft_option " data-value="6">七月</div>
            <div class="xdsoft_option " data-value="7">八月</div>
            <div class="xdsoft_option " data-value="8">九月</div>
            <div class="xdsoft_option " data-value="9">十月</div>
            <div class="xdsoft_option " data-value="10">十一月</div>
            <div class="xdsoft_option " data-value="11">十二月</div>
          </div>
          <div class="xdsoft_scrollbar">
            <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
          </div>
        </div>
        <i></i></div>
      <div class="xdsoft_label xdsoft_year"><span>2018</span>
        <div class="xdsoft_select xdsoft_yearselect xdsoft_scroller_box">
          <div style="margin-top: 0px;">
            <div class="xdsoft_option " data-value="1950">1950</div>
            <div class="xdsoft_option " data-value="1951">1951</div>
            <div class="xdsoft_option " data-value="1952">1952</div>
            <div class="xdsoft_option " data-value="1953">1953</div>
            <div class="xdsoft_option " data-value="1954">1954</div>
            <div class="xdsoft_option " data-value="1955">1955</div>
            <div class="xdsoft_option " data-value="1956">1956</div>
            <div class="xdsoft_option " data-value="1957">1957</div>
            <div class="xdsoft_option " data-value="1958">1958</div>
            <div class="xdsoft_option " data-value="1959">1959</div>
            <div class="xdsoft_option " data-value="1960">1960</div>
            <div class="xdsoft_option " data-value="1961">1961</div>
            <div class="xdsoft_option " data-value="1962">1962</div>
            <div class="xdsoft_option " data-value="1963">1963</div>
            <div class="xdsoft_option " data-value="1964">1964</div>
            <div class="xdsoft_option " data-value="1965">1965</div>
            <div class="xdsoft_option " data-value="1966">1966</div>
            <div class="xdsoft_option " data-value="1967">1967</div>
            <div class="xdsoft_option " data-value="1968">1968</div>
            <div class="xdsoft_option " data-value="1969">1969</div>
            <div class="xdsoft_option " data-value="1970">1970</div>
            <div class="xdsoft_option " data-value="1971">1971</div>
            <div class="xdsoft_option " data-value="1972">1972</div>
            <div class="xdsoft_option " data-value="1973">1973</div>
            <div class="xdsoft_option " data-value="1974">1974</div>
            <div class="xdsoft_option " data-value="1975">1975</div>
            <div class="xdsoft_option " data-value="1976">1976</div>
            <div class="xdsoft_option " data-value="1977">1977</div>
            <div class="xdsoft_option " data-value="1978">1978</div>
            <div class="xdsoft_option " data-value="1979">1979</div>
            <div class="xdsoft_option " data-value="1980">1980</div>
            <div class="xdsoft_option " data-value="1981">1981</div>
            <div class="xdsoft_option " data-value="1982">1982</div>
            <div class="xdsoft_option " data-value="1983">1983</div>
            <div class="xdsoft_option " data-value="1984">1984</div>
            <div class="xdsoft_option " data-value="1985">1985</div>
            <div class="xdsoft_option " data-value="1986">1986</div>
            <div class="xdsoft_option " data-value="1987">1987</div>
            <div class="xdsoft_option " data-value="1988">1988</div>
            <div class="xdsoft_option " data-value="1989">1989</div>
            <div class="xdsoft_option " data-value="1990">1990</div>
            <div class="xdsoft_option " data-value="1991">1991</div>
            <div class="xdsoft_option " data-value="1992">1992</div>
            <div class="xdsoft_option " data-value="1993">1993</div>
            <div class="xdsoft_option " data-value="1994">1994</div>
            <div class="xdsoft_option " data-value="1995">1995</div>
            <div class="xdsoft_option " data-value="1996">1996</div>
            <div class="xdsoft_option " data-value="1997">1997</div>
            <div class="xdsoft_option " data-value="1998">1998</div>
            <div class="xdsoft_option " data-value="1999">1999</div>
            <div class="xdsoft_option " data-value="2000">2000</div>
            <div class="xdsoft_option " data-value="2001">2001</div>
            <div class="xdsoft_option " data-value="2002">2002</div>
            <div class="xdsoft_option " data-value="2003">2003</div>
            <div class="xdsoft_option " data-value="2004">2004</div>
            <div class="xdsoft_option " data-value="2005">2005</div>
            <div class="xdsoft_option " data-value="2006">2006</div>
            <div class="xdsoft_option " data-value="2007">2007</div>
            <div class="xdsoft_option " data-value="2008">2008</div>
            <div class="xdsoft_option " data-value="2009">2009</div>
            <div class="xdsoft_option " data-value="2010">2010</div>
            <div class="xdsoft_option " data-value="2011">2011</div>
            <div class="xdsoft_option " data-value="2012">2012</div>
            <div class="xdsoft_option " data-value="2013">2013</div>
            <div class="xdsoft_option " data-value="2014">2014</div>
            <div class="xdsoft_option " data-value="2015">2015</div>
            <div class="xdsoft_option " data-value="2016">2016</div>
            <div class="xdsoft_option " data-value="2017">2017</div>
            <div class="xdsoft_option xdsoft_current" data-value="2018">2018</div>
            <div class="xdsoft_option " data-value="2019">2019</div>
            <div class="xdsoft_option " data-value="2020">2020</div>
            <div class="xdsoft_option " data-value="2021">2021</div>
            <div class="xdsoft_option " data-value="2022">2022</div>
            <div class="xdsoft_option " data-value="2023">2023</div>
            <div class="xdsoft_option " data-value="2024">2024</div>
            <div class="xdsoft_option " data-value="2025">2025</div>
            <div class="xdsoft_option " data-value="2026">2026</div>
            <div class="xdsoft_option " data-value="2027">2027</div>
            <div class="xdsoft_option " data-value="2028">2028</div>
            <div class="xdsoft_option " data-value="2029">2029</div>
            <div class="xdsoft_option " data-value="2030">2030</div>
            <div class="xdsoft_option " data-value="2031">2031</div>
            <div class="xdsoft_option " data-value="2032">2032</div>
            <div class="xdsoft_option " data-value="2033">2033</div>
            <div class="xdsoft_option " data-value="2034">2034</div>
            <div class="xdsoft_option " data-value="2035">2035</div>
            <div class="xdsoft_option " data-value="2036">2036</div>
            <div class="xdsoft_option " data-value="2037">2037</div>
            <div class="xdsoft_option " data-value="2038">2038</div>
            <div class="xdsoft_option " data-value="2039">2039</div>
            <div class="xdsoft_option " data-value="2040">2040</div>
            <div class="xdsoft_option " data-value="2041">2041</div>
            <div class="xdsoft_option " data-value="2042">2042</div>
            <div class="xdsoft_option " data-value="2043">2043</div>
            <div class="xdsoft_option " data-value="2044">2044</div>
            <div class="xdsoft_option " data-value="2045">2045</div>
            <div class="xdsoft_option " data-value="2046">2046</div>
            <div class="xdsoft_option " data-value="2047">2047</div>
            <div class="xdsoft_option " data-value="2048">2048</div>
            <div class="xdsoft_option " data-value="2049">2049</div>
            <div class="xdsoft_option " data-value="2050">2050</div>
          </div>
          <div class="xdsoft_scrollbar">
            <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
          </div>
        </div>
        <i></i></div>
      <button type="button" class="xdsoft_next" style="visibility: visible;"></button>
    </div>
    <div class="xdsoft_calendar">
      <table>
        <thead>
        <tr>
          <th>日</th>
          <th>一</th>
          <th>二</th>
          <th>三</th>
          <th>四</th>
          <th>五</th>
          <th>六</th>
        </tr>
        </thead>
        <tbody>
        <tr>
          <td data-date="31" data-month="11" data-year="2017" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_other_month xdsoft_weekend" title="">
            <div>31</div>
          </td>
          <td data-date="1" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>1</div>
          </td>
          <td data-date="2" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>2</div>
          </td>
          <td data-date="3" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>3</div>
          </td>
          <td data-date="4" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>4</div>
          </td>
          <td data-date="5" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>5</div>
          </td>
          <td data-date="6" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>6</div>
          </td>
        </tr>
        <tr>
          <td data-date="7" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>7</div>
          </td>
          <td data-date="8" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>8</div>
          </td>
          <td data-date="9" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>9</div>
          </td>
          <td data-date="10" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>10</div>
          </td>
          <td data-date="11" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>11</div>
          </td>
          <td data-date="12" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date xdsoft_current xdsoft_today" title="">
            <div>12</div>
          </td>
          <td data-date="13" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>13</div>
          </td>
        </tr>
        <tr>
          <td data-date="14" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>14</div>
          </td>
          <td data-date="15" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>15</div>
          </td>
          <td data-date="16" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>16</div>
          </td>
          <td data-date="17" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>17</div>
          </td>
          <td data-date="18" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>18</div>
          </td>
          <td data-date="19" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>19</div>
          </td>
          <td data-date="20" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>20</div>
          </td>
        </tr>
        <tr>
          <td data-date="21" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>21</div>
          </td>
          <td data-date="22" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>22</div>
          </td>
          <td data-date="23" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>23</div>
          </td>
          <td data-date="24" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>24</div>
          </td>
          <td data-date="25" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>25</div>
          </td>
          <td data-date="26" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>26</div>
          </td>
          <td data-date="27" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>27</div>
          </td>
        </tr>
        <tr>
          <td data-date="28" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>28</div>
          </td>
          <td data-date="29" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>29</div>
          </td>
          <td data-date="30" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>30</div>
          </td>
          <td data-date="31" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>31</div>
          </td>
          <td data-date="1" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date xdsoft_other_month" title="">
            <div>1</div>
          </td>
          <td data-date="2" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date xdsoft_other_month" title="">
            <div>2</div>
          </td>
          <td data-date="3" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_other_month xdsoft_weekend" title="">
            <div>3</div>
          </td>
        </tr>
        </tbody>
      </table>
    </div>
    <button type="button" class="xdsoft_save_selected blue-gradient-button" style="display: none;">Save Selected</button>
  </div>
  <div class="xdsoft_timepicker active">
    <button type="button" class="xdsoft_prev"></button>
    <div class="xdsoft_time_box xdsoft_scroller_box">
      <div class="xdsoft_time_variant" style="margin-top: 0px;">
        <div class="xdsoft_time " data-hour="0" data-minute="0">00:00</div>
        <div class="xdsoft_time " data-hour="0" data-minute="30">00:30</div>
        <div class="xdsoft_time " data-hour="1" data-minute="0">01:00</div>
        <div class="xdsoft_time " data-hour="1" data-minute="30">01:30</div>
        <div class="xdsoft_time " data-hour="2" data-minute="0">02:00</div>
        <div class="xdsoft_time " data-hour="2" data-minute="30">02:30</div>
        <div class="xdsoft_time " data-hour="3" data-minute="0">03:00</div>
        <div class="xdsoft_time " data-hour="3" data-minute="30">03:30</div>
        <div class="xdsoft_time " data-hour="4" data-minute="0">04:00</div>
        <div class="xdsoft_time " data-hour="4" data-minute="30">04:30</div>
        <div class="xdsoft_time " data-hour="5" data-minute="0">05:00</div>
        <div class="xdsoft_time " data-hour="5" data-minute="30">05:30</div>
        <div class="xdsoft_time " data-hour="6" data-minute="0">06:00</div>
        <div class="xdsoft_time " data-hour="6" data-minute="30">06:30</div>
        <div class="xdsoft_time " data-hour="7" data-minute="0">07:00</div>
        <div class="xdsoft_time " data-hour="7" data-minute="30">07:30</div>
        <div class="xdsoft_time " data-hour="8" data-minute="0">08:00</div>
        <div class="xdsoft_time " data-hour="8" data-minute="30">08:30</div>
        <div class="xdsoft_time " data-hour="9" data-minute="0">09:00</div>
        <div class="xdsoft_time " data-hour="9" data-minute="30">09:30</div>
        <div class="xdsoft_time " data-hour="10" data-minute="0">10:00</div>
        <div class="xdsoft_time " data-hour="10" data-minute="30">10:30</div>
        <div class="xdsoft_time " data-hour="11" data-minute="0">11:00</div>
        <div class="xdsoft_time " data-hour="11" data-minute="30">11:30</div>
        <div class="xdsoft_time " data-hour="12" data-minute="0">12:00</div>
        <div class="xdsoft_time " data-hour="12" data-minute="30">12:30</div>
        <div class="xdsoft_time " data-hour="13" data-minute="0">13:00</div>
        <div class="xdsoft_time " data-hour="13" data-minute="30">13:30</div>
        <div class="xdsoft_time " data-hour="14" data-minute="0">14:00</div>
        <div class="xdsoft_time " data-hour="14" data-minute="30">14:30</div>
        <div class="xdsoft_time " data-hour="15" data-minute="0">15:00</div>
        <div class="xdsoft_time " data-hour="15" data-minute="30">15:30</div>
        <div class="xdsoft_time " data-hour="16" data-minute="0">16:00</div>
        <div class="xdsoft_time " data-hour="16" data-minute="30">16:30</div>
        <div class="xdsoft_time " data-hour="17" data-minute="0">17:00</div>
        <div class="xdsoft_time " data-hour="17" data-minute="30">17:30</div>
        <div class="xdsoft_time " data-hour="18" data-minute="0">18:00</div>
        <div class="xdsoft_time " data-hour="18" data-minute="30">18:30</div>
        <div class="xdsoft_time " data-hour="19" data-minute="0">19:00</div>
        <div class="xdsoft_time " data-hour="19" data-minute="30">19:30</div>
        <div class="xdsoft_time " data-hour="20" data-minute="0">20:00</div>
        <div class="xdsoft_time " data-hour="20" data-minute="30">20:30</div>
        <div class="xdsoft_time " data-hour="21" data-minute="0">21:00</div>
        <div class="xdsoft_time " data-hour="21" data-minute="30">21:30</div>
        <div class="xdsoft_time " data-hour="22" data-minute="0">22:00</div>
        <div class="xdsoft_time xdsoft_current" data-hour="22" data-minute="30">22:30</div>
        <div class="xdsoft_time " data-hour="23" data-minute="0">23:00</div>
        <div class="xdsoft_time " data-hour="23" data-minute="30">23:30</div>
      </div>
      <div class="xdsoft_scrollbar">
        <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
      </div>
    </div>
    <button type="button" class="xdsoft_next"></button>
  </div>
</div>
<div class="xdsoft_datetimepicker xdsoft_noselect xdsoft_">
  <div class="xdsoft_datepicker active">
    <div class="xdsoft_mounthpicker">
      <button type="button" class="xdsoft_prev" style="visibility: visible;"></button>
      <button type="button" class="xdsoft_today_button" style="visibility: visible;"></button>
      <div class="xdsoft_label xdsoft_month"><span>一月</span>
        <div class="xdsoft_select xdsoft_monthselect xdsoft_scroller_box">
          <div style="margin-top: 0px;">
            <div class="xdsoft_option xdsoft_current" data-value="0">一月</div>
            <div class="xdsoft_option " data-value="1">二月</div>
            <div class="xdsoft_option " data-value="2">三月</div>
            <div class="xdsoft_option " data-value="3">四月</div>
            <div class="xdsoft_option " data-value="4">五月</div>
            <div class="xdsoft_option " data-value="5">六月</div>
            <div class="xdsoft_option " data-value="6">七月</div>
            <div class="xdsoft_option " data-value="7">八月</div>
            <div class="xdsoft_option " data-value="8">九月</div>
            <div class="xdsoft_option " data-value="9">十月</div>
            <div class="xdsoft_option " data-value="10">十一月</div>
            <div class="xdsoft_option " data-value="11">十二月</div>
          </div>
          <div class="xdsoft_scrollbar">
            <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
          </div>
        </div>
        <i></i></div>
      <div class="xdsoft_label xdsoft_year"><span>2018</span>
        <div class="xdsoft_select xdsoft_yearselect xdsoft_scroller_box">
          <div style="margin-top: 0px;">
            <div class="xdsoft_option " data-value="1950">1950</div>
            <div class="xdsoft_option " data-value="1951">1951</div>
            <div class="xdsoft_option " data-value="1952">1952</div>
            <div class="xdsoft_option " data-value="1953">1953</div>
            <div class="xdsoft_option " data-value="1954">1954</div>
            <div class="xdsoft_option " data-value="1955">1955</div>
            <div class="xdsoft_option " data-value="1956">1956</div>
            <div class="xdsoft_option " data-value="1957">1957</div>
            <div class="xdsoft_option " data-value="1958">1958</div>
            <div class="xdsoft_option " data-value="1959">1959</div>
            <div class="xdsoft_option " data-value="1960">1960</div>
            <div class="xdsoft_option " data-value="1961">1961</div>
            <div class="xdsoft_option " data-value="1962">1962</div>
            <div class="xdsoft_option " data-value="1963">1963</div>
            <div class="xdsoft_option " data-value="1964">1964</div>
            <div class="xdsoft_option " data-value="1965">1965</div>
            <div class="xdsoft_option " data-value="1966">1966</div>
            <div class="xdsoft_option " data-value="1967">1967</div>
            <div class="xdsoft_option " data-value="1968">1968</div>
            <div class="xdsoft_option " data-value="1969">1969</div>
            <div class="xdsoft_option " data-value="1970">1970</div>
            <div class="xdsoft_option " data-value="1971">1971</div>
            <div class="xdsoft_option " data-value="1972">1972</div>
            <div class="xdsoft_option " data-value="1973">1973</div>
            <div class="xdsoft_option " data-value="1974">1974</div>
            <div class="xdsoft_option " data-value="1975">1975</div>
            <div class="xdsoft_option " data-value="1976">1976</div>
            <div class="xdsoft_option " data-value="1977">1977</div>
            <div class="xdsoft_option " data-value="1978">1978</div>
            <div class="xdsoft_option " data-value="1979">1979</div>
            <div class="xdsoft_option " data-value="1980">1980</div>
            <div class="xdsoft_option " data-value="1981">1981</div>
            <div class="xdsoft_option " data-value="1982">1982</div>
            <div class="xdsoft_option " data-value="1983">1983</div>
            <div class="xdsoft_option " data-value="1984">1984</div>
            <div class="xdsoft_option " data-value="1985">1985</div>
            <div class="xdsoft_option " data-value="1986">1986</div>
            <div class="xdsoft_option " data-value="1987">1987</div>
            <div class="xdsoft_option " data-value="1988">1988</div>
            <div class="xdsoft_option " data-value="1989">1989</div>
            <div class="xdsoft_option " data-value="1990">1990</div>
            <div class="xdsoft_option " data-value="1991">1991</div>
            <div class="xdsoft_option " data-value="1992">1992</div>
            <div class="xdsoft_option " data-value="1993">1993</div>
            <div class="xdsoft_option " data-value="1994">1994</div>
            <div class="xdsoft_option " data-value="1995">1995</div>
            <div class="xdsoft_option " data-value="1996">1996</div>
            <div class="xdsoft_option " data-value="1997">1997</div>
            <div class="xdsoft_option " data-value="1998">1998</div>
            <div class="xdsoft_option " data-value="1999">1999</div>
            <div class="xdsoft_option " data-value="2000">2000</div>
            <div class="xdsoft_option " data-value="2001">2001</div>
            <div class="xdsoft_option " data-value="2002">2002</div>
            <div class="xdsoft_option " data-value="2003">2003</div>
            <div class="xdsoft_option " data-value="2004">2004</div>
            <div class="xdsoft_option " data-value="2005">2005</div>
            <div class="xdsoft_option " data-value="2006">2006</div>
            <div class="xdsoft_option " data-value="2007">2007</div>
            <div class="xdsoft_option " data-value="2008">2008</div>
            <div class="xdsoft_option " data-value="2009">2009</div>
            <div class="xdsoft_option " data-value="2010">2010</div>
            <div class="xdsoft_option " data-value="2011">2011</div>
            <div class="xdsoft_option " data-value="2012">2012</div>
            <div class="xdsoft_option " data-value="2013">2013</div>
            <div class="xdsoft_option " data-value="2014">2014</div>
            <div class="xdsoft_option " data-value="2015">2015</div>
            <div class="xdsoft_option " data-value="2016">2016</div>
            <div class="xdsoft_option " data-value="2017">2017</div>
            <div class="xdsoft_option xdsoft_current" data-value="2018">2018</div>
            <div class="xdsoft_option " data-value="2019">2019</div>
            <div class="xdsoft_option " data-value="2020">2020</div>
            <div class="xdsoft_option " data-value="2021">2021</div>
            <div class="xdsoft_option " data-value="2022">2022</div>
            <div class="xdsoft_option " data-value="2023">2023</div>
            <div class="xdsoft_option " data-value="2024">2024</div>
            <div class="xdsoft_option " data-value="2025">2025</div>
            <div class="xdsoft_option " data-value="2026">2026</div>
            <div class="xdsoft_option " data-value="2027">2027</div>
            <div class="xdsoft_option " data-value="2028">2028</div>
            <div class="xdsoft_option " data-value="2029">2029</div>
            <div class="xdsoft_option " data-value="2030">2030</div>
            <div class="xdsoft_option " data-value="2031">2031</div>
            <div class="xdsoft_option " data-value="2032">2032</div>
            <div class="xdsoft_option " data-value="2033">2033</div>
            <div class="xdsoft_option " data-value="2034">2034</div>
            <div class="xdsoft_option " data-value="2035">2035</div>
            <div class="xdsoft_option " data-value="2036">2036</div>
            <div class="xdsoft_option " data-value="2037">2037</div>
            <div class="xdsoft_option " data-value="2038">2038</div>
            <div class="xdsoft_option " data-value="2039">2039</div>
            <div class="xdsoft_option " data-value="2040">2040</div>
            <div class="xdsoft_option " data-value="2041">2041</div>
            <div class="xdsoft_option " data-value="2042">2042</div>
            <div class="xdsoft_option " data-value="2043">2043</div>
            <div class="xdsoft_option " data-value="2044">2044</div>
            <div class="xdsoft_option " data-value="2045">2045</div>
            <div class="xdsoft_option " data-value="2046">2046</div>
            <div class="xdsoft_option " data-value="2047">2047</div>
            <div class="xdsoft_option " data-value="2048">2048</div>
            <div class="xdsoft_option " data-value="2049">2049</div>
            <div class="xdsoft_option " data-value="2050">2050</div>
          </div>
          <div class="xdsoft_scrollbar">
            <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
          </div>
        </div>
        <i></i></div>
      <button type="button" class="xdsoft_next" style="visibility: visible;"></button>
    </div>
    <div class="xdsoft_calendar">
      <table>
        <thead>
        <tr>
          <th>日</th>
          <th>一</th>
          <th>二</th>
          <th>三</th>
          <th>四</th>
          <th>五</th>
          <th>六</th>
        </tr>
        </thead>
        <tbody>
        <tr>
          <td data-date="31" data-month="11" data-year="2017" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_other_month xdsoft_weekend" title="">
            <div>31</div>
          </td>
          <td data-date="1" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>1</div>
          </td>
          <td data-date="2" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>2</div>
          </td>
          <td data-date="3" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>3</div>
          </td>
          <td data-date="4" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>4</div>
          </td>
          <td data-date="5" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>5</div>
          </td>
          <td data-date="6" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>6</div>
          </td>
        </tr>
        <tr>
          <td data-date="7" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>7</div>
          </td>
          <td data-date="8" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>8</div>
          </td>
          <td data-date="9" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>9</div>
          </td>
          <td data-date="10" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>10</div>
          </td>
          <td data-date="11" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>11</div>
          </td>
          <td data-date="12" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date xdsoft_current xdsoft_today" title="">
            <div>12</div>
          </td>
          <td data-date="13" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>13</div>
          </td>
        </tr>
        <tr>
          <td data-date="14" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>14</div>
          </td>
          <td data-date="15" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>15</div>
          </td>
          <td data-date="16" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>16</div>
          </td>
          <td data-date="17" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>17</div>
          </td>
          <td data-date="18" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>18</div>
          </td>
          <td data-date="19" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>19</div>
          </td>
          <td data-date="20" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>20</div>
          </td>
        </tr>
        <tr>
          <td data-date="21" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>21</div>
          </td>
          <td data-date="22" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>22</div>
          </td>
          <td data-date="23" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>23</div>
          </td>
          <td data-date="24" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>24</div>
          </td>
          <td data-date="25" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date" title="">
            <div>25</div>
          </td>
          <td data-date="26" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date" title="">
            <div>26</div>
          </td>
          <td data-date="27" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_weekend" title="">
            <div>27</div>
          </td>
        </tr>
        <tr>
          <td data-date="28" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week0 xdsoft_date xdsoft_weekend" title="">
            <div>28</div>
          </td>
          <td data-date="29" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week1 xdsoft_date" title="">
            <div>29</div>
          </td>
          <td data-date="30" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week2 xdsoft_date" title="">
            <div>30</div>
          </td>
          <td data-date="31" data-month="0" data-year="2018" class="xdsoft_date xdsoft_day_of_week3 xdsoft_date" title="">
            <div>31</div>
          </td>
          <td data-date="1" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week4 xdsoft_date xdsoft_other_month" title="">
            <div>1</div>
          </td>
          <td data-date="2" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week5 xdsoft_date xdsoft_other_month" title="">
            <div>2</div>
          </td>
          <td data-date="3" data-month="1" data-year="2018" class="xdsoft_date xdsoft_day_of_week6 xdsoft_date xdsoft_other_month xdsoft_weekend" title="">
            <div>3</div>
          </td>
        </tr>
        </tbody>
      </table>
    </div>
    <button type="button" class="xdsoft_save_selected blue-gradient-button" style="display: none;">Save Selected</button>
  </div>
  <div class="xdsoft_timepicker active">
    <button type="button" class="xdsoft_prev"></button>
    <div class="xdsoft_time_box xdsoft_scroller_box">
      <div class="xdsoft_time_variant" style="margin-top: 0px;">
        <div class="xdsoft_time " data-hour="0" data-minute="0">00:00</div>
        <div class="xdsoft_time " data-hour="0" data-minute="30">00:30</div>
        <div class="xdsoft_time " data-hour="1" data-minute="0">01:00</div>
        <div class="xdsoft_time " data-hour="1" data-minute="30">01:30</div>
        <div class="xdsoft_time " data-hour="2" data-minute="0">02:00</div>
        <div class="xdsoft_time " data-hour="2" data-minute="30">02:30</div>
        <div class="xdsoft_time " data-hour="3" data-minute="0">03:00</div>
        <div class="xdsoft_time " data-hour="3" data-minute="30">03:30</div>
        <div class="xdsoft_time " data-hour="4" data-minute="0">04:00</div>
        <div class="xdsoft_time " data-hour="4" data-minute="30">04:30</div>
        <div class="xdsoft_time " data-hour="5" data-minute="0">05:00</div>
        <div class="xdsoft_time " data-hour="5" data-minute="30">05:30</div>
        <div class="xdsoft_time " data-hour="6" data-minute="0">06:00</div>
        <div class="xdsoft_time " data-hour="6" data-minute="30">06:30</div>
        <div class="xdsoft_time " data-hour="7" data-minute="0">07:00</div>
        <div class="xdsoft_time " data-hour="7" data-minute="30">07:30</div>
        <div class="xdsoft_time " data-hour="8" data-minute="0">08:00</div>
        <div class="xdsoft_time " data-hour="8" data-minute="30">08:30</div>
        <div class="xdsoft_time " data-hour="9" data-minute="0">09:00</div>
        <div class="xdsoft_time " data-hour="9" data-minute="30">09:30</div>
        <div class="xdsoft_time " data-hour="10" data-minute="0">10:00</div>
        <div class="xdsoft_time " data-hour="10" data-minute="30">10:30</div>
        <div class="xdsoft_time " data-hour="11" data-minute="0">11:00</div>
        <div class="xdsoft_time " data-hour="11" data-minute="30">11:30</div>
        <div class="xdsoft_time " data-hour="12" data-minute="0">12:00</div>
        <div class="xdsoft_time " data-hour="12" data-minute="30">12:30</div>
        <div class="xdsoft_time " data-hour="13" data-minute="0">13:00</div>
        <div class="xdsoft_time " data-hour="13" data-minute="30">13:30</div>
        <div class="xdsoft_time " data-hour="14" data-minute="0">14:00</div>
        <div class="xdsoft_time " data-hour="14" data-minute="30">14:30</div>
        <div class="xdsoft_time " data-hour="15" data-minute="0">15:00</div>
        <div class="xdsoft_time " data-hour="15" data-minute="30">15:30</div>
        <div class="xdsoft_time " data-hour="16" data-minute="0">16:00</div>
        <div class="xdsoft_time " data-hour="16" data-minute="30">16:30</div>
        <div class="xdsoft_time " data-hour="17" data-minute="0">17:00</div>
        <div class="xdsoft_time " data-hour="17" data-minute="30">17:30</div>
        <div class="xdsoft_time " data-hour="18" data-minute="0">18:00</div>
        <div class="xdsoft_time " data-hour="18" data-minute="30">18:30</div>
        <div class="xdsoft_time " data-hour="19" data-minute="0">19:00</div>
        <div class="xdsoft_time " data-hour="19" data-minute="30">19:30</div>
        <div class="xdsoft_time " data-hour="20" data-minute="0">20:00</div>
        <div class="xdsoft_time " data-hour="20" data-minute="30">20:30</div>
        <div class="xdsoft_time " data-hour="21" data-minute="0">21:00</div>
        <div class="xdsoft_time " data-hour="21" data-minute="30">21:30</div>
        <div class="xdsoft_time " data-hour="22" data-minute="0">22:00</div>
        <div class="xdsoft_time xdsoft_current" data-hour="22" data-minute="30">22:30</div>
        <div class="xdsoft_time " data-hour="23" data-minute="0">23:00</div>
        <div class="xdsoft_time " data-hour="23" data-minute="30">23:30</div>
      </div>
      <div class="xdsoft_scrollbar">
        <div class="xdsoft_scroller" style="display: block; height: 10px; margin-top: 0px;"></div>
      </div>
    </div>
    <button type="button" class="xdsoft_next"></button>
  </div>
</div>
</body>
</html>